@hmcts/ccpay-web-component 6.5.22-beta01 → 6.5.22-dp

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/fesm2022/hmcts-ccpay-web-component.mjs +185 -171
  2. package/fesm2022/hmcts-ccpay-web-component.mjs.map +1 -1
  3. package/index.d.ts +3 -0
  4. package/package.json +19 -5
package/fesm2022/hmcts-ccpay-web-component.mjs CHANGED
@@ -60,10 +60,10 @@ class PaymentLibService {
60
60
  getCardPaymentReturnUrl() {
61
61
  return this.CARDPAYMENTRETURNURL;
62
62
  }
63
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: PaymentLibService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
64
- static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: PaymentLibService, providedIn: 'root' });
63
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: PaymentLibService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
64
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: PaymentLibService, providedIn: 'root' });
65
65
  }
66
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: PaymentLibService, decorators: [{
66
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: PaymentLibService, decorators: [{
67
67
  type: Injectable,
68
68
  args: [{
69
69
  providedIn: 'root'
@@ -211,10 +211,10 @@ class OrderslistService {
211
211
  getoorderTotalPaymentss() {
212
212
  return this.orderTotalPayments;
213
213
  }
214
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: OrderslistService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
215
- static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: OrderslistService, providedIn: 'root' });
214
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: OrderslistService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
215
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: OrderslistService, providedIn: 'root' });
216
216
  }
217
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: OrderslistService, decorators: [{
217
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: OrderslistService, decorators: [{
218
218
  type: Injectable,
219
219
  args: [{
220
220
  providedIn: 'root'
@@ -272,10 +272,10 @@ class WebComponentHttpClient {
272
272
  options.responseType = 'text';
273
273
  return options;
274
274
  }
275
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: WebComponentHttpClient, deps: [{ token: i1.HttpClient }, { token: i2.Meta }], target: i0.ɵɵFactoryTarget.Injectable });
276
- static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: WebComponentHttpClient });
275
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: WebComponentHttpClient, deps: [{ token: i1.HttpClient }, { token: i2.Meta }], target: i0.ɵɵFactoryTarget.Injectable });
276
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: WebComponentHttpClient });
277
277
  }
278
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: WebComponentHttpClient, decorators: [{
278
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: WebComponentHttpClient, decorators: [{
279
279
  type: Injectable
280
280
  }], ctorParameters: () => [{ type: i1.HttpClient }, { type: i2.Meta }] });
281
281
 
@@ -342,10 +342,10 @@ class ErrorHandlerService {
342
342
  showError: isErrorExist
343
343
  };
344
344
  }
345
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: ErrorHandlerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
346
- static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: ErrorHandlerService, providedIn: 'root' });
345
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: ErrorHandlerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
346
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: ErrorHandlerService, providedIn: 'root' });
347
347
  }
348
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: ErrorHandlerService, decorators: [{
348
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: ErrorHandlerService, decorators: [{
349
349
  type: Injectable,
350
350
  args: [{
351
351
  providedIn: 'root'
@@ -363,10 +363,10 @@ class LoggerService {
363
363
  warn;
364
364
  error;
365
365
  invokeConsoleMethod(type, args) { }
366
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: LoggerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
367
- static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: LoggerService, providedIn: 'root' });
366
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: LoggerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
367
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: LoggerService, providedIn: 'root' });
368
368
  }
369
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: LoggerService, decorators: [{
369
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: LoggerService, decorators: [{
370
370
  type: Injectable,
371
371
  args: [{
372
372
  providedIn: 'root'
@@ -505,10 +505,10 @@ class PaymentViewService {
505
505
  withCredentials: true
506
506
  }).pipe(catchError(this.errorHandlerService.handleError));
507
507
  }
508
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: PaymentViewService, deps: [{ token: i1.HttpClient }, { token: WebComponentHttpClient }, { token: LoggerService }, { token: ErrorHandlerService }, { token: PaymentLibService }], target: i0.ɵɵFactoryTarget.Injectable });
509
- static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: PaymentViewService, providedIn: 'root' });
508
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: PaymentViewService, deps: [{ token: i1.HttpClient }, { token: WebComponentHttpClient }, { token: LoggerService }, { token: ErrorHandlerService }, { token: PaymentLibService }], target: i0.ɵɵFactoryTarget.Injectable });
509
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: PaymentViewService, providedIn: 'root' });
510
510
  }
511
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: PaymentViewService, decorators: [{
511
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: PaymentViewService, decorators: [{
512
512
  type: Injectable,
513
513
  args: [{
514
514
  providedIn: 'root'
@@ -564,10 +564,10 @@ class NotificationService {
564
564
  return 'Template';
565
565
  }
566
566
  }
567
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: NotificationService, deps: [{ token: i1.HttpClient }, { token: WebComponentHttpClient }, { token: ErrorHandlerService }, { token: PaymentLibService }], target: i0.ɵɵFactoryTarget.Injectable });
568
- static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: NotificationService, providedIn: 'root' });
567
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: NotificationService, deps: [{ token: i1.HttpClient }, { token: WebComponentHttpClient }, { token: ErrorHandlerService }, { token: PaymentLibService }], target: i0.ɵɵFactoryTarget.Injectable });
568
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: NotificationService, providedIn: 'root' });
569
569
  }
570
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: NotificationService, decorators: [{
570
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: NotificationService, decorators: [{
571
571
  type: Injectable,
572
572
  args: [{
573
573
  providedIn: 'root'
@@ -712,10 +712,10 @@ class RefundsService {
712
712
  options.responseType = 'text';
713
713
  return options;
714
714
  }
715
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: RefundsService, deps: [{ token: i1.HttpClient }, { token: WebComponentHttpClient }, { token: ErrorHandlerService }, { token: PaymentLibService }, { token: i2.Meta }], target: i0.ɵɵFactoryTarget.Injectable });
716
- static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: RefundsService, providedIn: 'root' });
715
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: RefundsService, deps: [{ token: i1.HttpClient }, { token: WebComponentHttpClient }, { token: ErrorHandlerService }, { token: PaymentLibService }, { token: i2.Meta }], target: i0.ɵɵFactoryTarget.Injectable });
716
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: RefundsService, providedIn: 'root' });
717
717
  }
718
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: RefundsService, decorators: [{
718
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: RefundsService, decorators: [{
719
719
  type: Injectable,
720
720
  args: [{
721
721
  providedIn: 'root'
@@ -1040,10 +1040,10 @@ class ContactDetailsComponent {
1040
1040
  this.isCountryEmpty = val[13];
1041
1041
  }
1042
1042
  }
1043
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: ContactDetailsComponent, deps: [{ token: i1$1.FormBuilder }, { token: NotificationService }, { token: 'PAYMENT_LIB' }], target: i0.ɵɵFactoryTarget.Component });
1044
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.1", type: ContactDetailsComponent, isStandalone: true, selector: "ccpay-contact-details", inputs: { isEditOperation: "isEditOperation", isEditOperationInRefundList: "isEditOperationInRefundList", addressObj: "addressObj" }, outputs: { assignContactDetails: "assignContactDetails", assignContactDetailsInFefundsList: "assignContactDetailsInFefundsList", redirectToIssueRefund: "redirectToIssueRefund" }, ngImport: i0, template: "<fieldset class=\"govuk-fieldset contact-details--size\">\n <hr class=\"govuk-section-break govuk-section-break--m govuk-section-break--visible\">\n <div class=\"govuk-form-group\">\n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--s govuk-font19px\">\n {{ isEditOperation ? 'Edit contact information' : 'Contact information' }}\n </legend>\n <div id=\"contact-hint\" class=\"govuk-hint govuk-font19px\">\n Notifications will be sent via email or post when this refund is issued or rejected. You can only choose one option.\n </div>\n <div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\">\n <div class=\"govuk-radios govuk-radios--conditional\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"contact\" name=\"contact\" (click)=\"selectContactOption('Email', 'false')\" type=\"radio\" value=\"email\" [checked]=\"isEmailSAddressClicked\" aria-controls=\"conditional-contact\" aria-expanded=\"true\">\n <label class=\"govuk-label govuk-radios__label govuk-font19px\" for=\"contact\">\n Email\n </label>\n </div>\n <div class=\"govuk-radios__conditional\" id=\"conditional-contact-email\" *ngIf=\"isEmailSAddressClicked\">\n <form [formGroup]=\"emailAddressForm\" novalidate>\n <div class=\"govuk-form-group\">\n <label class=\"govuk-label \" for=\"email\">\n <span class=\"govuk-hint govuk-font19px\">Information about this refund will be sent to this email address.</span>\n </label>\n\n <div id=\"email-hint\" class=\"govuk-hint\">\n </div>\n <input class=\"govuk-input govuk-font19px\" id=\"email\" name=\"\" type=\"email\" [ngClass]=\"{ 'inline-error-class': isEmailEmpty || emailHasError }\" value=\"{{addressObj?.contact_details?.email}}\" formControlName=\"email\" aria-describedby=\"email-hint\">\n <p class=\"inline-error-message\" *ngIf=\"isEmailEmpty || emailHasError\">\n <span *ngIf=\"isEmailEmpty\">Enter a email address.</span>\n <span *ngIf=\"emailHasError\">Enter a valid email address.</span>\n </p>\n </div>\n </form>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"contact-2\" name=\"contact\" (click)=\"selectContactOption('Postcode', 'false')\" type=\"radio\" [checked]=\"isPostcodeClicked\" value=\"post\" aria-controls=\"conditional-contact-2\" aria-expanded=\"false\">\n <label class=\"govuk-label govuk-radios__label govuk-font19px\" for=\"contact-2\">\n Post\n </label>\n </div>\n <div class=\"govuk-radios__conditional\" id=\"conditional-contact-postcode\" *ngIf=\"isPostcodeClicked && !isManualAddressClicked\">\n <form [formGroup]=\"postCodeForm\" novalidate>\n <label class=\"govuk-label govuk-font19px\" for=\"address-postcode\">\n <span class=\"govuk-hint govuk-font19px\">Information about this refund will be sent to this address.</span>Postcode\n </label>\n <div class=\"postcode-align-css\">\n <div class=\"govuk-form-group govuk-margin-right-10px\">\n <input class=\"govuk-input govuk-input--width-10\" id=\"address-postcode\" name=\"address-postcode\" [ngClass]=\"{ 'inline-error-class': isPostcodeEmpty || postcodeHasError }\" formControlName=\"postcode\" type=\"text\" autocomplete=\"postal-code\">\n <p class=\"inline-error-message\" *ngIf=\"isPostcodeEmpty || postcodeHasError\">\n <span *ngIf=\"isPostcodeEmpty\">Enter a postcode.</span>\n <span *ngIf=\"postcodeHasError\">Enter a valid postcode.</span>\n </p>\n </div>\n <div class=\"govuk-button-group\">\n <button class=\"govuk-button govuk-button--secondary govuk-font19px\" (click)=\"postcodeValidation('FA')\" data-module=\"govuk-button\">\n Find address\n </button>\n </div>\n </div>\n </form>\n <div class=\"govuk-form-group govuk-margin-btm-20px\" *ngIf=\"isShowPickAddress\">\n <label class=\"govuk-label govuk-font19px\" for=\"country\">\n Pick an address\n </label>\n <select class=\"govuk-select govuk-font19px\" [(ngModel)]=\"postcodeAddress\" id=\"postcodeAddress\" [ngClass]=\"{ 'inline-error-class': isAddressBoxEmpty }\" name=\"postcodeAddress\">\n <option *ngFor=\"let address of addressPostcodeList;\" [ngValue]=\"address.DPA\" > {{address.DPA.ADDRESS}}</option>\n </select> \n <p class=\"inline-error-message\" *ngIf=\"isAddressBoxEmpty\">\n <span *ngIf=\"isAddressBoxEmpty\">Please select an address.</span>\n </p>\n </div>\n <details class=\"govuk-details\" data-module=\"govuk-details\">\n <summary class=\"govuk-details__summary\">\n <span class=\"govuk-details__summary-text govuk-font19px\">\n <a href=\"Javascript:void(0);\" (click)=\"selectContactOption('Postcode', 'true')\"> Enter address manually</a>\n </span>\n </summary>\n </details>\n </div>\n <div class=\"govuk-radios__conditional\" id=\"conditional-contact-manual\" *ngIf=\"isPostcodeClicked && isManualAddressClicked\">\n <form [formGroup]=\"manualAddressForm\" novalidate>\n\n <div class=\"govuk-form-group\">\n <label class=\"govuk-label govuk-font19px\" for=\"address-line-1\">\n <span class=\"govuk-hint govuk-font19px\">Information about this refund will be sent to this address.</span>Building and street <span class=\"govuk-visually-hidden\">line 1 of 2</span>\n </label>\n <input class=\"govuk-input govuk-font19px\" id=\"address-line-1\" name=\"address-line-1\" [ngClass]=\"{ 'inline-error-class': isaddressLine1Empty || addressLine1HasError }\" value=\"{{addressObj?.contact_details?.address_line}}\" formControlName=\"addressl1\" type=\"text\" autocomplete=\"address-line1\">\n <p class=\"inline-error-message\" *ngIf=\"isaddressLine1Empty || addressLine1HasError\">\n <span *ngIf=\"isaddressLine1Empty\">Enter a Building and street.</span>\n <span *ngIf=\"addressLine1HasError\">Enter a valid Building and street.</span>\n </p> \n </div>\n <div class=\"govuk-form-group\">\n <label class=\"govuk-label\" for=\"address-line-2\">\n <span class=\"govuk-visually-hidden govuk-font19px\">Building and street line 2 of 2</span>\n </label>\n <input class=\"govuk-input govuk-font19px\" id=\"address-line-2\" name=\"address-line-2\" [ngClass]=\"{ 'inline-error-class': addressLine2HasError}\" formControlName=\"addressl2\" type=\"text\" autocomplete=\"address-line2\">\n <p class=\"inline-error-message\" *ngIf=\"addressLine2HasError\">\n <span *ngIf=\"addressLine2HasError\">Enter a valid Building and street line 2 of 2.</span>\n </p> \n </div>\n <div class=\"govuk-form-group\">\n <label class=\"govuk-label govuk-font19px\" for=\"address-town\">\n Town or city\n </label>\n <input class=\"govuk-input govuk-!-width-two-thirds govuk-font19px\" id=\"address-town\" name=\"address-town\" [ngClass]=\"{ 'inline-error-class': isTownOrCityEmpty || townOrCityHasError}\" value=\"{{addressObj?.contact_details?.city}}\" formControlName=\"townorcity\" type=\"text\" autocomplete=\"address-level2\">\n <p class=\"inline-error-message\" *ngIf=\"isTownOrCityEmpty || townOrCityHasError\">\n <span *ngIf=\"isTownOrCityEmpty\">Enter a town or city.</span>\n <span *ngIf=\"townOrCityHasError\">Enter a town or city.</span>\n </p> \n </div>\n <div class=\"govuk-form-group\">\n <label class=\"govuk-label govuk-font19px\" for=\"address-county\">\n County\n </label>\n <input class=\"govuk-input govuk-!-width-two-thirds govuk-font19px\" id=\"address-county\" [ngClass]=\"{ 'inline-error-class': isCountyEmpty || countyHasError}\" value=\"{{addressObj?.contact_details?.county}}\" formControlName=\"county\" name=\"address-county\" type=\"text\">\n <p class=\"inline-error-message\" *ngIf=\"isCountyEmpty || countyHasError\">\n <span *ngIf=\"isCountyEmpty\">Enter a County.</span>\n <span *ngIf=\"countyHasError\">Enter a valid County.</span>\n </p> \n </div>\n <div class=\"govuk-form-group\">\n <label class=\"govuk-label govuk-font19px\" for=\"address-postcode\">\n Postcode\n </label>\n <input class=\"govuk-input govuk-input--width-10 govuk-font19px\" id=\"address-postcode\" formControlName=\"mpostcode\" name=\"address-postcode\" [ngClass]=\"{ 'inline-error-class': isMPostcodeEmpty || mpostcodeHasError}\" value=\"{{addressObj?.contact_details?.postal_code}}\" type=\"text\" autocomplete=\"postal-code\">\n <p class=\"inline-error-message\" *ngIf=\"isMPostcodeEmpty || mpostcodeHasError\">\n <span *ngIf=\"isMPostcodeEmpty\">Enter a postcode.</span>\n <span *ngIf=\"mpostcodeHasError\">Enter a valid postcode.</span>\n </p> \n </div>\n <div class=\"govuk-form-group\">\n <label class=\"govuk-label govuk-font19px\" for=\"country\">\n Country\n </label>\n <select class=\"govuk-select govuk-font19px\" id=\"country\" name=\"country\" [ngClass]=\"{'inline-error-class': isCountryEmpty}\" formControlName=\"country\">\n <option value=\"\" selected=\"selected\">Please select</option>\n <option value=\"United Kingdom\" selected=\"{{ addressObj?.contact_details?.country ? 'selected' : '' }}\">United Kingdom</option>\n </select>\n <p class=\"inline-error-message\" *ngIf=\"isCountryEmpty\">\n <span *ngIf=\"isCountryEmpty\">Select a Country.</span>\n </p> \n </div>\n </form>\n </div>\n </div>\n </fieldset>\n </div>\n <!---FORM--->\n </div>\n\n<hr class=\"govuk-section-break govuk-section-break--m govuk-section-break--visible\">\n</fieldset>\n<div class=\"govuk-button-group\">\n<button type=\"submit\" class=\"button govuk-button--secondary govuk-font19px\" (click)=\"redirection($event)\"> Previous </button>\n&nbsp;\n<button type=\"submit\" class=\"button govuk-button govuk-font19px\" (click)=\"finalFormSubmit()\">\n Continue\n</button>\n</div>", styles: [".govuk-font19px{font-size:19px}.inline-error-class{outline:3px solid #a71414;outline-offset:0}.inline-error-message{color:#a71414;font-weight:700;margin-top:10px}.contact-details--size{width:50%}.postcode-align-css{display:flex;flex-direction:row}.govuk-margin-right-10px{margin-right:10px}.govuk-margin-btm-20px{margin-bottom:20px!important}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
1043
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: ContactDetailsComponent, deps: [{ token: i1$1.FormBuilder }, { token: NotificationService }, { token: 'PAYMENT_LIB' }], target: i0.ɵɵFactoryTarget.Component });
1044
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: ContactDetailsComponent, isStandalone: true, selector: "ccpay-contact-details", inputs: { isEditOperation: "isEditOperation", isEditOperationInRefundList: "isEditOperationInRefundList", addressObj: "addressObj" }, outputs: { assignContactDetails: "assignContactDetails", assignContactDetailsInFefundsList: "assignContactDetailsInFefundsList", redirectToIssueRefund: "redirectToIssueRefund" }, ngImport: i0, template: "<fieldset class=\"govuk-fieldset contact-details--size\">\n <hr class=\"govuk-section-break govuk-section-break--m govuk-section-break--visible\">\n <div class=\"govuk-form-group\">\n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--s govuk-font19px\">\n {{ isEditOperation ? 'Edit contact information' : 'Contact information' }}\n </legend>\n <div id=\"contact-hint\" class=\"govuk-hint govuk-font19px\">\n Notifications will be sent via email or post when this refund is issued or rejected. You can only choose one option.\n </div>\n <div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\">\n <div class=\"govuk-radios govuk-radios--conditional\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"contact\" name=\"contact\" (click)=\"selectContactOption('Email', 'false')\" type=\"radio\" value=\"email\" [checked]=\"isEmailSAddressClicked\" aria-controls=\"conditional-contact\" aria-expanded=\"true\">\n <label class=\"govuk-label govuk-radios__label govuk-font19px\" for=\"contact\">\n Email\n </label>\n </div>\n <div class=\"govuk-radios__conditional\" id=\"conditional-contact-email\" *ngIf=\"isEmailSAddressClicked\">\n <form [formGroup]=\"emailAddressForm\" novalidate>\n <div class=\"govuk-form-group\">\n <label class=\"govuk-label \" for=\"email\">\n <span class=\"govuk-hint govuk-font19px\">Information about this refund will be sent to this email address.</span>\n </label>\n\n <div id=\"email-hint\" class=\"govuk-hint\">\n </div>\n <input class=\"govuk-input govuk-font19px\" id=\"email\" name=\"\" type=\"email\" [ngClass]=\"{ 'inline-error-class': isEmailEmpty || emailHasError }\" value=\"{{addressObj?.contact_details?.email}}\" formControlName=\"email\" aria-describedby=\"email-hint\">\n <p class=\"inline-error-message\" *ngIf=\"isEmailEmpty || emailHasError\">\n <span *ngIf=\"isEmailEmpty\">Enter a email address.</span>\n <span *ngIf=\"emailHasError\">Enter a valid email address.</span>\n </p>\n </div>\n </form>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"contact-2\" name=\"contact\" (click)=\"selectContactOption('Postcode', 'false')\" type=\"radio\" [checked]=\"isPostcodeClicked\" value=\"post\" aria-controls=\"conditional-contact-2\" aria-expanded=\"false\">\n <label class=\"govuk-label govuk-radios__label govuk-font19px\" for=\"contact-2\">\n Post\n </label>\n </div>\n <div class=\"govuk-radios__conditional\" id=\"conditional-contact-postcode\" *ngIf=\"isPostcodeClicked && !isManualAddressClicked\">\n <form [formGroup]=\"postCodeForm\" novalidate>\n <label class=\"govuk-label govuk-font19px\" for=\"address-postcode\">\n <span class=\"govuk-hint govuk-font19px\">Information about this refund will be sent to this address.</span>Postcode\n </label>\n <div class=\"postcode-align-css\">\n <div class=\"govuk-form-group govuk-margin-right-10px\">\n <input class=\"govuk-input govuk-input--width-10\" id=\"address-postcode\" name=\"address-postcode\" [ngClass]=\"{ 'inline-error-class': isPostcodeEmpty || postcodeHasError }\" formControlName=\"postcode\" type=\"text\" autocomplete=\"postal-code\">\n <p class=\"inline-error-message\" *ngIf=\"isPostcodeEmpty || postcodeHasError\">\n <span *ngIf=\"isPostcodeEmpty\">Enter a postcode.</span>\n <span *ngIf=\"postcodeHasError\">Enter a valid postcode.</span>\n </p>\n </div>\n <div class=\"govuk-button-group\">\n <button class=\"govuk-button govuk-button--secondary govuk-font19px\" (click)=\"postcodeValidation('FA')\" data-module=\"govuk-button\">\n Find address\n </button>\n </div>\n </div>\n </form>\n <div class=\"govuk-form-group govuk-margin-btm-20px\" *ngIf=\"isShowPickAddress\">\n <label class=\"govuk-label govuk-font19px\" for=\"country\">\n Pick an address\n </label>\n <select class=\"govuk-select govuk-font19px\" [(ngModel)]=\"postcodeAddress\" id=\"postcodeAddress\" [ngClass]=\"{ 'inline-error-class': isAddressBoxEmpty }\" name=\"postcodeAddress\">\n <option *ngFor=\"let address of addressPostcodeList;\" [ngValue]=\"address.DPA\" > {{address.DPA.ADDRESS}}</option>\n </select> \n <p class=\"inline-error-message\" *ngIf=\"isAddressBoxEmpty\">\n <span *ngIf=\"isAddressBoxEmpty\">Please select an address.</span>\n </p>\n </div>\n <details class=\"govuk-details\" data-module=\"govuk-details\">\n <summary class=\"govuk-details__summary\">\n <span class=\"govuk-details__summary-text govuk-font19px\">\n <a href=\"Javascript:void(0);\" (click)=\"selectContactOption('Postcode', 'true')\"> Enter address manually</a>\n </span>\n </summary>\n </details>\n </div>\n <div class=\"govuk-radios__conditional\" id=\"conditional-contact-manual\" *ngIf=\"isPostcodeClicked && isManualAddressClicked\">\n <form [formGroup]=\"manualAddressForm\" novalidate>\n\n <div class=\"govuk-form-group\">\n <label class=\"govuk-label govuk-font19px\" for=\"address-line-1\">\n <span class=\"govuk-hint govuk-font19px\">Information about this refund will be sent to this address.</span>Building and street <span class=\"govuk-visually-hidden\">line 1 of 2</span>\n </label>\n <input class=\"govuk-input govuk-font19px\" id=\"address-line-1\" name=\"address-line-1\" [ngClass]=\"{ 'inline-error-class': isaddressLine1Empty || addressLine1HasError }\" value=\"{{addressObj?.contact_details?.address_line}}\" formControlName=\"addressl1\" type=\"text\" autocomplete=\"address-line1\">\n <p class=\"inline-error-message\" *ngIf=\"isaddressLine1Empty || addressLine1HasError\">\n <span *ngIf=\"isaddressLine1Empty\">Enter a Building and street.</span>\n <span *ngIf=\"addressLine1HasError\">Enter a valid Building and street.</span>\n </p> \n </div>\n <div class=\"govuk-form-group\">\n <label class=\"govuk-label\" for=\"address-line-2\">\n <span class=\"govuk-visually-hidden govuk-font19px\">Building and street line 2 of 2</span>\n </label>\n <input class=\"govuk-input govuk-font19px\" id=\"address-line-2\" name=\"address-line-2\" [ngClass]=\"{ 'inline-error-class': addressLine2HasError}\" formControlName=\"addressl2\" type=\"text\" autocomplete=\"address-line2\">\n <p class=\"inline-error-message\" *ngIf=\"addressLine2HasError\">\n <span *ngIf=\"addressLine2HasError\">Enter a valid Building and street line 2 of 2.</span>\n </p> \n </div>\n <div class=\"govuk-form-group\">\n <label class=\"govuk-label govuk-font19px\" for=\"address-town\">\n Town or city\n </label>\n <input class=\"govuk-input govuk-!-width-two-thirds govuk-font19px\" id=\"address-town\" name=\"address-town\" [ngClass]=\"{ 'inline-error-class': isTownOrCityEmpty || townOrCityHasError}\" value=\"{{addressObj?.contact_details?.city}}\" formControlName=\"townorcity\" type=\"text\" autocomplete=\"address-level2\">\n <p class=\"inline-error-message\" *ngIf=\"isTownOrCityEmpty || townOrCityHasError\">\n <span *ngIf=\"isTownOrCityEmpty\">Enter a town or city.</span>\n <span *ngIf=\"townOrCityHasError\">Enter a town or city.</span>\n </p> \n </div>\n <div class=\"govuk-form-group\">\n <label class=\"govuk-label govuk-font19px\" for=\"address-county\">\n County\n </label>\n <input class=\"govuk-input govuk-!-width-two-thirds govuk-font19px\" id=\"address-county\" [ngClass]=\"{ 'inline-error-class': isCountyEmpty || countyHasError}\" value=\"{{addressObj?.contact_details?.county}}\" formControlName=\"county\" name=\"address-county\" type=\"text\">\n <p class=\"inline-error-message\" *ngIf=\"isCountyEmpty || countyHasError\">\n <span *ngIf=\"isCountyEmpty\">Enter a County.</span>\n <span *ngIf=\"countyHasError\">Enter a valid County.</span>\n </p> \n </div>\n <div class=\"govuk-form-group\">\n <label class=\"govuk-label govuk-font19px\" for=\"address-postcode\">\n Postcode\n </label>\n <input class=\"govuk-input govuk-input--width-10 govuk-font19px\" id=\"address-postcode\" formControlName=\"mpostcode\" name=\"address-postcode\" [ngClass]=\"{ 'inline-error-class': isMPostcodeEmpty || mpostcodeHasError}\" value=\"{{addressObj?.contact_details?.postal_code}}\" type=\"text\" autocomplete=\"postal-code\">\n <p class=\"inline-error-message\" *ngIf=\"isMPostcodeEmpty || mpostcodeHasError\">\n <span *ngIf=\"isMPostcodeEmpty\">Enter a postcode.</span>\n <span *ngIf=\"mpostcodeHasError\">Enter a valid postcode.</span>\n </p> \n </div>\n <div class=\"govuk-form-group\">\n <label class=\"govuk-label govuk-font19px\" for=\"country\">\n Country\n </label>\n <select class=\"govuk-select govuk-font19px\" id=\"country\" name=\"country\" [ngClass]=\"{'inline-error-class': isCountryEmpty}\" formControlName=\"country\">\n <option value=\"\" selected=\"selected\">Please select</option>\n <option value=\"United Kingdom\" selected=\"{{ addressObj?.contact_details?.country ? 'selected' : '' }}\">United Kingdom</option>\n </select>\n <p class=\"inline-error-message\" *ngIf=\"isCountryEmpty\">\n <span *ngIf=\"isCountryEmpty\">Select a Country.</span>\n </p> \n </div>\n </form>\n </div>\n </div>\n </fieldset>\n </div>\n <!---FORM--->\n </div>\n\n<hr class=\"govuk-section-break govuk-section-break--m govuk-section-break--visible\">\n</fieldset>\n<div class=\"govuk-button-group\">\n<button type=\"submit\" class=\"button govuk-button--secondary govuk-font19px\" (click)=\"redirection($event)\"> Previous </button>\n&nbsp;\n<button type=\"submit\" class=\"button govuk-button govuk-font19px\" (click)=\"finalFormSubmit()\">\n Continue\n</button>\n</div>", styles: [".govuk-font19px{font-size:19px}.inline-error-class{outline:3px solid #a71414;outline-offset:0}.inline-error-message{color:#a71414;font-weight:700;margin-top:10px}.contact-details--size{width:50%}.postcode-align-css{display:flex;flex-direction:row}.govuk-margin-right-10px{margin-right:10px}.govuk-margin-btm-20px{margin-bottom:20px!important}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
1045
1045
  }
1046
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: ContactDetailsComponent, decorators: [{
1046
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: ContactDetailsComponent, decorators: [{
1047
1047
  type: Component,
1048
1048
  args: [{ selector: 'ccpay-contact-details', imports: [
1049
1049
  FormsModule,
@@ -1159,10 +1159,10 @@ class NotificationPreviewComponent {
1159
1159
  this.notificationPreviewEvent.emit(this.notification);
1160
1160
  }
1161
1161
  }
1162
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: NotificationPreviewComponent, deps: [{ token: ErrorHandlerService }, { token: NotificationService }], target: i0.ɵɵFactoryTarget.Component });
1163
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.1", type: NotificationPreviewComponent, isStandalone: true, selector: "app-notification-preview", inputs: { payment: "payment", contactDetails: "contactDetails", refundReason: "refundReason", refundAmount: "refundAmount", paymentReference: "paymentReference", refundReference: "refundReference", previewJourney: "previewJourney", notificationSent: "notificationSent" }, outputs: { notificationPreviewEvent: "notificationPreviewEvent" }, ngImport: i0, template: "<div class=\"govuk-grid-column-full\">\n <table class=\"govuk-table\">\n <tbody class=\"govuk-table__body\">\n <ng-container *ngIf=\"notification?.template_type === 'email'\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell whitespace-inherit\"><span class=\"govuk-!-font-weight-bold\">From:</span>\n {{notification?.from?.from_email_address}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell whitespace-inherit\"><span class=\"govuk-!-font-weight-bold\">To:</span>\n {{notification?.recipient_contact?.recipient_email_address}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell whitespace-inherit\"><span class=\"govuk-!-font-weight-bold\">Subject:</span>\n {{notification?.subject}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell whitespace-inherit\">\n <div [innerHTML]=\"notification?.html\"></div>\n </td>\n </tr>\n </ng-container>\n <ng-container *ngIf=\"notification?.template_type === 'letter'\">\n <tr class=\"govuk-table__row\">\n <td class=\"letter-row-border\">\n <ng-container *ngIf=\"notification?.recipient_contact?.recipient_mail_address?.address_line\">\n {{notification?.recipient_contact?.recipient_mail_address?.address_line}}<br /></ng-container>\n <ng-container *ngIf=\"notification?.recipient_contact?.recipient_mail_address?.city\">\n {{notification?.recipient_contact?.recipient_mail_address?.city}}<br /></ng-container>\n <ng-container *ngIf=\"notification?.recipient_contact?.recipient_mail_address?.county\">\n {{notification?.recipient_contact?.recipient_mail_address?.county}}<br /></ng-container>\n <ng-container *ngIf=\"notification?.recipient_contact?.recipient_mail_address?.country\">\n {{notification?.recipient_contact?.recipient_mail_address?.country}}<br /></ng-container>\n {{notification?.recipient_contact?.recipient_mail_address?.postal_code}}\n </td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"letter-row-border\">{{ today | date:'d MMMM y' }}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"letter-row-border\"><span class=\"govuk-!-font-weight-bold\">{{notification?.subject}}</span></td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell whitespace-inherit\">\n <div [innerHTML]=\"notification?.body\"></div>\n </td>\n </tr>\n </ng-container>\n \n </tbody>\n </table>\n</div>\n", styles: [".right{float:right}.letter-row-border{border-bottom:none}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i3.DatePipe, name: "date" }] });
1162
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: NotificationPreviewComponent, deps: [{ token: ErrorHandlerService }, { token: NotificationService }], target: i0.ɵɵFactoryTarget.Component });
1163
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: NotificationPreviewComponent, isStandalone: true, selector: "app-notification-preview", inputs: { payment: "payment", contactDetails: "contactDetails", refundReason: "refundReason", refundAmount: "refundAmount", paymentReference: "paymentReference", refundReference: "refundReference", previewJourney: "previewJourney", notificationSent: "notificationSent" }, outputs: { notificationPreviewEvent: "notificationPreviewEvent" }, ngImport: i0, template: "<div class=\"govuk-grid-column-full\">\n <table class=\"govuk-table\">\n <tbody class=\"govuk-table__body\">\n <ng-container *ngIf=\"notification?.template_type === 'email'\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell whitespace-inherit\"><span class=\"govuk-!-font-weight-bold\">From:</span>\n {{notification?.from?.from_email_address}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell whitespace-inherit\"><span class=\"govuk-!-font-weight-bold\">To:</span>\n {{notification?.recipient_contact?.recipient_email_address}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell whitespace-inherit\"><span class=\"govuk-!-font-weight-bold\">Subject:</span>\n {{notification?.subject}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell whitespace-inherit\">\n <div [innerHTML]=\"notification?.html\"></div>\n </td>\n </tr>\n </ng-container>\n <ng-container *ngIf=\"notification?.template_type === 'letter'\">\n <tr class=\"govuk-table__row\">\n <td class=\"letter-row-border\">\n <ng-container *ngIf=\"notification?.recipient_contact?.recipient_mail_address?.address_line\">\n {{notification?.recipient_contact?.recipient_mail_address?.address_line}}<br /></ng-container>\n <ng-container *ngIf=\"notification?.recipient_contact?.recipient_mail_address?.city\">\n {{notification?.recipient_contact?.recipient_mail_address?.city}}<br /></ng-container>\n <ng-container *ngIf=\"notification?.recipient_contact?.recipient_mail_address?.county\">\n {{notification?.recipient_contact?.recipient_mail_address?.county}}<br /></ng-container>\n <ng-container *ngIf=\"notification?.recipient_contact?.recipient_mail_address?.country\">\n {{notification?.recipient_contact?.recipient_mail_address?.country}}<br /></ng-container>\n {{notification?.recipient_contact?.recipient_mail_address?.postal_code}}\n </td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"letter-row-border\">{{ today | date:'d MMMM y' }}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"letter-row-border\"><span class=\"govuk-!-font-weight-bold\">{{notification?.subject}}</span></td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell whitespace-inherit\">\n <div [innerHTML]=\"notification?.body\"></div>\n </td>\n </tr>\n </ng-container>\n \n </tbody>\n </table>\n</div>\n", styles: [".right{float:right}.letter-row-border{border-bottom:none}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i3.DatePipe, name: "date" }] });
1164
1164
  }
1165
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: NotificationPreviewComponent, decorators: [{
1165
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: NotificationPreviewComponent, decorators: [{
1166
1166
  type: Component,
1167
1167
  args: [{ selector: 'app-notification-preview', imports: [CommonModule], standalone: true, template: "<div class=\"govuk-grid-column-full\">\n <table class=\"govuk-table\">\n <tbody class=\"govuk-table__body\">\n <ng-container *ngIf=\"notification?.template_type === 'email'\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell whitespace-inherit\"><span class=\"govuk-!-font-weight-bold\">From:</span>\n {{notification?.from?.from_email_address}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell whitespace-inherit\"><span class=\"govuk-!-font-weight-bold\">To:</span>\n {{notification?.recipient_contact?.recipient_email_address}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell whitespace-inherit\"><span class=\"govuk-!-font-weight-bold\">Subject:</span>\n {{notification?.subject}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell whitespace-inherit\">\n <div [innerHTML]=\"notification?.html\"></div>\n </td>\n </tr>\n </ng-container>\n <ng-container *ngIf=\"notification?.template_type === 'letter'\">\n <tr class=\"govuk-table__row\">\n <td class=\"letter-row-border\">\n <ng-container *ngIf=\"notification?.recipient_contact?.recipient_mail_address?.address_line\">\n {{notification?.recipient_contact?.recipient_mail_address?.address_line}}<br /></ng-container>\n <ng-container *ngIf=\"notification?.recipient_contact?.recipient_mail_address?.city\">\n {{notification?.recipient_contact?.recipient_mail_address?.city}}<br /></ng-container>\n <ng-container *ngIf=\"notification?.recipient_contact?.recipient_mail_address?.county\">\n {{notification?.recipient_contact?.recipient_mail_address?.county}}<br /></ng-container>\n <ng-container *ngIf=\"notification?.recipient_contact?.recipient_mail_address?.country\">\n {{notification?.recipient_contact?.recipient_mail_address?.country}}<br /></ng-container>\n {{notification?.recipient_contact?.recipient_mail_address?.postal_code}}\n </td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"letter-row-border\">{{ today | date:'d MMMM y' }}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"letter-row-border\"><span class=\"govuk-!-font-weight-bold\">{{notification?.subject}}</span></td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell whitespace-inherit\">\n <div [innerHTML]=\"notification?.body\"></div>\n </td>\n </tr>\n </ng-container>\n \n </tbody>\n </table>\n</div>\n", styles: [".right{float:right}.letter-row-border{border-bottom:none}\n"] }]
1168
1168
  }], ctorParameters: () => [{ type: ErrorHandlerService }, { type: NotificationService }], propDecorators: { payment: [{
@@ -1203,10 +1203,10 @@ class CaseTransactionsService {
1203
1203
  })
1204
1204
  .pipe(catchError(this.errorHandlerService.handleError));
1205
1205
  }
1206
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: CaseTransactionsService, deps: [{ token: i1.HttpClient }, { token: LoggerService }, { token: ErrorHandlerService }, { token: PaymentLibService }], target: i0.ɵɵFactoryTarget.Injectable });
1207
- static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: CaseTransactionsService, providedIn: 'root' });
1206
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: CaseTransactionsService, deps: [{ token: i1.HttpClient }, { token: LoggerService }, { token: ErrorHandlerService }, { token: PaymentLibService }], target: i0.ɵɵFactoryTarget.Injectable });
1207
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: CaseTransactionsService, providedIn: 'root' });
1208
1208
  }
1209
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: CaseTransactionsService, decorators: [{
1209
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: CaseTransactionsService, decorators: [{
1210
1210
  type: Injectable,
1211
1211
  args: [{
1212
1212
  providedIn: 'root'
@@ -1267,7 +1267,9 @@ class BulkScaningPaymentService {
1267
1267
  remissionsTotal = remissionsTotal + remission.hwf_amount;
1268
1268
  });
1269
1269
  }
1270
- return (feesTotal - remissionsTotal) - paymentsTotal;
1270
+ // Summing GBP amounts as floats (e.g. 1789.64 + 387.00) can drift beyond 2dp
1271
+ // (eg 2176.6400000000003), so ensure result is rounded to 2 dp
1272
+ return Number((feesTotal - remissionsTotal - paymentsTotal).toFixed(2));
1271
1273
  }
1272
1274
  removeUnwantedString(input, replaceText) {
1273
1275
  const pattern = /[\_]/gi;
@@ -1279,10 +1281,10 @@ class BulkScaningPaymentService {
1279
1281
  })
1280
1282
  .pipe(catchError(this.errorHandlerService.handleError));
1281
1283
  }
1282
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: BulkScaningPaymentService, deps: [{ token: i1.HttpClient }, { token: WebComponentHttpClient }, { token: ErrorHandlerService }, { token: PaymentLibService }], target: i0.ɵɵFactoryTarget.Injectable });
1283
- static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: BulkScaningPaymentService, providedIn: 'root' });
1284
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: BulkScaningPaymentService, deps: [{ token: i1.HttpClient }, { token: WebComponentHttpClient }, { token: ErrorHandlerService }, { token: PaymentLibService }], target: i0.ɵɵFactoryTarget.Injectable });
1285
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: BulkScaningPaymentService, providedIn: 'root' });
1284
1286
  }
1285
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: BulkScaningPaymentService, decorators: [{
1287
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: BulkScaningPaymentService, decorators: [{
1286
1288
  type: Injectable,
1287
1289
  args: [{
1288
1290
  providedIn: 'root'
@@ -1479,10 +1481,10 @@ class UnprocessedPaymentsComponent {
1479
1481
  event.preventDefault();
1480
1482
  this.unassignedRecordSelectedList = obj;
1481
1483
  }
1482
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: UnprocessedPaymentsComponent, deps: [{ token: i1$2.Router }, { token: BulkScaningPaymentService }, { token: PaymentViewService }, { token: OrderslistService }], target: i0.ɵɵFactoryTarget.Component });
1483
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.1", type: UnprocessedPaymentsComponent, isStandalone: true, selector: "ccpay-app-unprocessed-payments", inputs: { FEE_RECORDS_EXISTS: "FEE_RECORDS_EXISTS", PAYMENTREF: "PAYMENTREF", ISTURNOFF: "ISTURNOFF", IS_BUTTON_ENABLE: "IS_BUTTON_ENABLE", IS_OS_AMT_AVAILABLE: "IS_OS_AMT_AVAILABLE", ISSFENABLE: "ISSFENABLE", PAYMENTSLENGTH: "PAYMENTSLENGTH", LEVEL: "LEVEL", CCD_CASE_NUMBER: "CCD_CASE_NUMBER", SELECTED_OPTION: "SELECTED_OPTION", DCN_NUMBER: "DCN_NUMBER", ISBSENABLE: "ISBSENABLE", CASETYPE: "CASETYPE" }, outputs: { selectedUnprocessedFeeEvent: "selectedUnprocessedFeeEvent", getUnprocessedFeeCount: "getUnprocessedFeeCount", setBspaymentdcn: "setBspaymentdcn", setViewName: "setViewName", setUnProcessedPaymentServiceId: "setUnProcessedPaymentServiceId", setPaymentGroupReference: "setPaymentGroupReference" }, ngImport: i0, template: "<!-- <ng-container *ngIf=\"IS_BUTTON_ENABLE\">\n <div class=\"unprocessed-payments govuk-grid-column-full govuk-!-padding-bottom-3\">\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='CASETRANSACTION'>\n <h3 class=\"heading-medium\" *ngIf=\"!IS_BUTTON_ENABLE\">Unprocessed payments</h3>\n <h3 class=\"heading-medium\" *ngIf=\"IS_BUTTON_ENABLE\">Unallocated payments</h3>\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\" *ngIf=\"IS_BUTTON_ENABLE && !isTurnOff\">Select</td>\n <td class=\"govuk-table__header\" scope=\"col\" *ngIf=\"IS_BUTTON_ENABLE && isTurnOff\"><a href=\"#\" (click)=\"unprocessedPaymentUnSelectEvent($event)\">Unselect</a></td>\n \n <td class=\"govuk-table__header\" scope=\"col\">Payment asset number (DCN)</td>\n <td class=\"govuk-table__header\" scope=\"col\">Banked date</td>\n <td class=\"govuk-table__header\" scope=\"col\">Amount</td>\n <td class=\"govuk-table__header\" scope=\"col\">Method</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\" >\n <tr class=\"govuk-table__row\" *ngFor=\"let unassignedRecord of unassignedRecordList; let i of index;\">\n <td class=\"govuk-table__cell\" *ngIf=\"IS_BUTTON_ENABLE\">\n <div class=\"multiple-choice unprocessed-payments--radio-button\">\n <input id=\"'unpaiedFee'+i+''\"\n aria-label=\"unassignedRecord\"\n name=\"unassignedRecord\"\n type=\"radio\"\n [(ngModel)]=\"recordId\"\n (click)=\"unprocessedPaymentSelectEvent(unassignedRecord.dcn_reference)\"\n value=\"{{unassignedRecord.dcn_reference}}\" />\n <label for=\"radio-inline-1\"></label>\n </div>\n </td>\n <td class=\"govuk-table__cell whitespace-inherit\">\n {{unassignedRecord.dcn_reference}}\n </td>\n <td class=\"govuk-table__cell whitespace-inherit\"> {{unassignedRecord.date_banked | date:'dd MMM yyyy'}}</td>\n <td class=\"govuk-table__cell whitespace-inherit\"> {{unassignedRecord.amount | currency :'GBP':'symbol':'1.2-2'}}</td>\n <td class=\"capitalize govuk-table__cell whitespace-inherit\"> {{ trimUnderscore(unassignedRecord.payment_method) | lowercase}} </td>\n </tr>\n </tbody>\n <tbody class=\"govuk-table__body\" *ngIf=\"upPaymentErrorMessage !== null\">\n <td class=\"govuk-table__cell\" colspan=\"6\">No unallocated payments record available</td>\n </tbody>\n </table>\n <div class=\"button-grb\" *ngIf=\"IS_BUTTON_ENABLE && !isTurnOff\">\n <button type=\"button\"\n [disabled]=\"!isAllocatedToNewFeebtnEnabled\"\n [ngClass]=\"!isAllocatedToNewFeebtnEnabled ? 'button govuk-button--secondary button--disabled govuk-!-margin-right-1' : 'button govuk-button--secondary govuk-!-margin-right-1'\" (click)=\"redirectToFeeSearchPage($event)\">\n Allocate to a new fee\n </button>\n <button type=\"button\" \n [disabled]=\"!isAllocateToExistingFeebtnEnabled\"\n [ngClass]='!isAllocateToExistingFeebtnEnabled ? \"button govuk-button--secondary button--disabled govuk-!-margin-right-1\" : \"button govuk-button--secondary govuk-!-margin-right-1\"' (click)=\"goToAllocatePage()\">\n Allocate to an existing fee\n </button>\n <button type=\"button\" \n [disabled]=\"!isMarkAsUnidentifiedbtnEnabled\"\n [ngClass]='!isMarkAsUnidentifiedbtnEnabled ? \"button govuk-button--secondary button--disabled govuk-!-margin-right-1\" : \"button govuk-button--secondary govuk-!-margin-right-1\"' (click)=\"loadUnsolicitedPage('unidentifiedPage')\">\n Mark as unidentified\n </button>\n <button type=\"button\" \n [disabled]=\"!isUnprocessedRecordSelected\"\n [ngClass]='!isUnprocessedRecordSelected ? \"button govuk-button--secondary button--disabled govuk-!-margin-right-1\" : \"button govuk-button--secondary govuk-!-margin-right-1\"' (click)=\"loadUnsolicitedPage('unsolicitedPage')\">\n Mark as transferred\n </button> \n </div>\n \n <div class=\"button-grb\" *ngIf=\"IS_BUTTON_ENABLE && isTurnOff\">\n <button type=\"button\"\n [disabled]=\"!isAllocatedToNewFeebtnEnabled\"\n [ngClass]=\"!isAllocatedToNewFeebtnEnabled ? 'button button--disabled govuk-!-margin-right-1' : 'button govuk-!-margin-right-1'\" (click)=\"redirectToFeeSearchPage($event)\">\n Allocate to a new fee\n </button>\n <button type=\"button\" \n [disabled]=\"!isAllocateToExistingFeebtnEnabled\"\n [ngClass]='!isAllocateToExistingFeebtnEnabled ? \"button button--disabled govuk-!-margin-right-1\" : \"button govuk-!-margin-right-1\"' (click)=\"goToAllocatePage()\">\n Allocate to an existing fee\n </button>\n <button type=\"button\" \n [disabled]=\"!isMarkAsUnidentifiedbtnEnabled\"\n [ngClass]='!isMarkAsUnidentifiedbtnEnabled ? \"button button--disabled govuk-!-margin-right-1\" : \"button govuk-!-margin-right-1\"' (click)=\"loadUnsolicitedPage('unidentifiedPage')\">\n Mark as unidentified\n </button>\n <button type=\"button\" \n [disabled]=\"!isUnprocessedRecordSelected\"\n [ngClass]='!isUnprocessedRecordSelected ? \"button button--disabled govuk-!-margin-right-1\" : \"button govuk-!-margin-right-1\"' (click)=\"loadUnsolicitedPage('unsolicitedPage')\">\n Mark as transferred\n </button> \n </div>\n </div>\n</ng-container> -->\n\n\n<ng-container *ngIf=\"!IS_BUTTON_ENABLE\">\n <table class=\"govuk-table\">\n \n <thead class=\"govuk-table__head\" *ngIf='PAYMENTSLENGTH === 0 '>\n <!-- <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header col-14\" scope=\"col\">Status</td>\n <td class=\"govuk-table__header col-10\" scope=\"col\">Amount</td>\n <td class=\"govuk-table__header col-14\" scope=\"col\">Date</td>\n <td class=\"govuk-table__header col-20\" scope=\"col\">Request reference</td>\n <td class=\"govuk-table__header col-9\" scope=\"col\"></td>\n <td class=\"govuk-table__header\" scope=\"col\"></td>\n </tr> -->\n </thead>\n <tbody class=\"govuk-table__body\">\n <tr class=\"govuk-table__row\" *ngFor=\"let unassignedRecord of unassignedRecordList; let i = index;\">\n <td class=\"govuk-table__cell whitespace-inherit\" class=\"col-13\">\n Unallocated \n </td>\n <td class=\"govuk-table__cell whitespace-inherit\"> {{unassignedRecord.amount | currency :'GBP':'symbol':'1.2-2'}}</td>\n <td class=\"govuk-table__cell whitespace-inherit\"></td>\n <td class=\"govuk-table__cell whitespace-inherit\"></td>\n <td class=\"govuk-table__cell whitespace-inherit\"></td>\n <td class=\"govuk-table__cell whitespace-inherit\"></td>\n </tr>\n </tbody>\n \n </table>\n\n</ng-container>\n\n\n<!--Orders Unallocated changes-->\n<ng-container *ngIf=\"IS_BUTTON_ENABLE\">\n <div class=\"unprocessed-payments\">\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='CASETRANSACTION'>\n <table class=\"table\">\n \n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header col-13\" scope=\"col\">Status</td>\n <td class=\"govuk-table__header col-9\" scope=\"col\">Amount</td>\n <td class=\"govuk-table__header col-16\" scope=\"col\">Date allocated</td>\n <td class=\"govuk-table__header col-24\" colspan=\"3\" scope=\"col\">Request reference</td>\n <td class=\"govuk-table__header col-13\" scope=\"col\"></td>\n <td class=\"govuk-table__header\" scope=\"col\"></td>\n </tr>\n </thead>\n <tbody>\n <ng-container *ngFor=\"let unassignedRecord of unassignedRecordList; let i = index;\">\n <tr>\n <td class=\"govuk-table__cell whitespace-inherit col-13\" >\n Unallocated \n </td>\n <td class=\"govuk-table__cell whitespace-inherit col-10\">\n {{unassignedRecord.amount | currency :'GBP':'symbol':'1.2-2'}}\n </td>\n <td class=\"govuk-table__cell whitespace-inherit\" colspan=\"8\">\n <div *ngIf=\"IS_BUTTON_ENABLE && !isTurnOff\" class=\"alignright\">\n <button type=\"button\"\n [disabled]=\"!isAllocatedToNewFeebtnEnabled\"\n [ngClass]=\"!isAllocatedToNewFeebtnEnabled ? 'button govuk-button--secondary button--disabled' : 'button govuk-button--secondary'\" (click)=\"redirectToFeeSearchPage($event,unassignedRecord.dcn_reference)\">\n Allocate to new service request\n </button><br/>\n <button type=\"button\" \n [disabled]=\"!isAllocateToExistingFeebtnEnabled\"\n [ngClass]='!isAllocateToExistingFeebtnEnabled ? \"button govuk-button--secondary button--disabled\" : \"button govuk-button--secondary\"' (click)=\"goToAllocatePage(unassignedRecord.dcn_reference)\">\n Allocate to existing service request \n </button>\n </div>\n \n </td>\n </tr>\n \n <!-- <ng-container> -->\n <tr>\n <td class=\"unassigned noborders\" colspan=\"10\">\n <summary (click)=\"unassignedRecord.expanded = !unassignedRecord.expanded\" class=\"govuk-details__summary\">\n <span class=\"govuk-details__summary-text\">\n More details and actions\n </span>\n </summary>\n <div *ngIf=\"unassignedRecord.expanded\" class=\"govuk-details__text govuk-!-margin-bottom-5 paddingright\">\n <dl class=\"govuk-summary-list govuk-!-margin-bottom-5\">\n <div class=\"govuk-summary-list__row\">\n <dt class=\"govuk-summary-list__key\">\n Method\n </dt>\n <dd class=\"govuk-summary-list__value\">\n {{ trimUnderscore(unassignedRecord.payment_method) | lowercase}}\n </dd>\n </div>\n <div class=\"govuk-summary-list__row\">\n <dt class=\"govuk-summary-list__key\">\n Payment assest number (DCN) \n </dt>\n <dd class=\"govuk-summary-list__value\">\n {{unassignedRecord.dcn_reference}}\n </dd>\n </div>\n </dl>\n <div class=\" govuk-!-margin-bottom-5\">\n <button type=\"button\" \n [disabled]=\"!isMarkAsUnidentifiedbtnEnabled\"\n [ngClass]='!isMarkAsUnidentifiedbtnEnabled ? \"button govuk-button--secondary button--disabled\" : \"button govuk-button--secondary\"' (click)=\"loadUnsolicitedPage('unidentifiedPage',unassignedRecord.dcn_reference)\">\n Mark as unidentified\n </button>\n </div>\n <div>\n <button type=\"button\" \n [disabled]=\"!isUnprocessedRecordSelected\"\n [ngClass]='!isUnprocessedRecordSelected ? \"button govuk-button--secondary button--disabled\" : \"button govuk-button--secondary\"' (click)=\"loadUnsolicitedPage('unsolicitedPage',unassignedRecord.dcn_reference)\">\n Mark as transferred\n </button> \n </div>\n\n </div>\n </td> \n </tr> \n <!-- </ng-container> -->\n </ng-container>\n </tbody>\n </table>\n \n </div>\n</ng-container>\n\n<ng-container *ngIf=\"viewStatus === 'main'\">\n\n</ng-container>\n<!-- <ng-container *ngIf=\"PAYMENTSLENGTH === 0 && unassignedRecordListLength === 0\">\n <br/>No payments.<br/>\n</ng-container> -->\n\n", styles: [".unprocessed-payments .unprocessed-payments--radio-button{bottom:10px}.disable{text-decoration:none;padding:.526315em .789473em .263157em;cursor:default;color:#fff;background-color:#00823b;pointer-events:none;font-size:1em;line-height:1.25;outline:1px solid transparent;outline-offset:-1px;-webkit-appearance:none;box-shadow:0 2px #003618}.button.disabled,.button[disabled=disabled],.button[disabled]{zoom:1;filter:alpha(opacity=50);opacity:.5}.button.disabled:active,.button[disabled=disabled]:active,.button[disabled]:active{top:0;-webkit-box-shadow:0 2px 0 #003618;-moz-box-shadow:0 2px 0 #003618;box-shadow:0 2px #003618}.button[disabled=disabled]{background:#00823b}.col-13{width:13%!important}.col-17{width:17%!important}.col-12{width:12%!important}.col-9{width:9%!important}.col-15{width:15%!important}.lowercase{text-transform:lowercase}.capitalize:first-letter{text-transform:uppercase}.whitespace-inherit{white-space:inherit!important}.top_row{display:table;width:100%}.top_row>div{display:table-cell;width:50%;border-bottom:1px solid #eee}.unassigned{border-top:hidden}.col-16{width:16%!important}.col-10{width:10%!important}.col-14{width:14%!important}.col-19{width:19%!important;padding-left:0!important}.col-18{width:18%!important;padding-left:0!important;padding-right:0!important}.col-21{width:21%!important}.col-20{width:20%!important}.col-11{width:11%!important}.col-37{width:37%!important}.noborders>td{border-color:transparent;border-top-style:hidden;border-right-style:hidden;border-left-style:hidden}.govuk-button--secondary{margin-bottom:10px}.govuk-summary-list{font-size:19px}.govuk-summary-list__key{width:35%}td{white-space:nowrap;overflow:hidden!important}table{table-layout:fixed;width:100%}th,td{word-wrap:break-word}.alignright{text-align:right}.paddingright{padding-right:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i3.LowerCasePipe, name: "lowercase" }, { kind: "pipe", type: i3.CurrencyPipe, name: "currency" }] });
1484
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: UnprocessedPaymentsComponent, deps: [{ token: i1$2.Router }, { token: BulkScaningPaymentService }, { token: PaymentViewService }, { token: OrderslistService }], target: i0.ɵɵFactoryTarget.Component });
1485
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: UnprocessedPaymentsComponent, isStandalone: true, selector: "ccpay-app-unprocessed-payments", inputs: { FEE_RECORDS_EXISTS: "FEE_RECORDS_EXISTS", PAYMENTREF: "PAYMENTREF", ISTURNOFF: "ISTURNOFF", IS_BUTTON_ENABLE: "IS_BUTTON_ENABLE", IS_OS_AMT_AVAILABLE: "IS_OS_AMT_AVAILABLE", ISSFENABLE: "ISSFENABLE", PAYMENTSLENGTH: "PAYMENTSLENGTH", LEVEL: "LEVEL", CCD_CASE_NUMBER: "CCD_CASE_NUMBER", SELECTED_OPTION: "SELECTED_OPTION", DCN_NUMBER: "DCN_NUMBER", ISBSENABLE: "ISBSENABLE", CASETYPE: "CASETYPE" }, outputs: { selectedUnprocessedFeeEvent: "selectedUnprocessedFeeEvent", getUnprocessedFeeCount: "getUnprocessedFeeCount", setBspaymentdcn: "setBspaymentdcn", setViewName: "setViewName", setUnProcessedPaymentServiceId: "setUnProcessedPaymentServiceId", setPaymentGroupReference: "setPaymentGroupReference" }, ngImport: i0, template: "<!-- <ng-container *ngIf=\"IS_BUTTON_ENABLE\">\n <div class=\"unprocessed-payments govuk-grid-column-full govuk-!-padding-bottom-3\">\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='CASETRANSACTION'>\n <h3 class=\"heading-medium\" *ngIf=\"!IS_BUTTON_ENABLE\">Unprocessed payments</h3>\n <h3 class=\"heading-medium\" *ngIf=\"IS_BUTTON_ENABLE\">Unallocated payments</h3>\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\" *ngIf=\"IS_BUTTON_ENABLE && !isTurnOff\">Select</td>\n <td class=\"govuk-table__header\" scope=\"col\" *ngIf=\"IS_BUTTON_ENABLE && isTurnOff\"><a href=\"#\" (click)=\"unprocessedPaymentUnSelectEvent($event)\">Unselect</a></td>\n \n <td class=\"govuk-table__header\" scope=\"col\">Payment asset number (DCN)</td>\n <td class=\"govuk-table__header\" scope=\"col\">Banked date</td>\n <td class=\"govuk-table__header\" scope=\"col\">Amount</td>\n <td class=\"govuk-table__header\" scope=\"col\">Method</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\" >\n <tr class=\"govuk-table__row\" *ngFor=\"let unassignedRecord of unassignedRecordList; let i of index;\">\n <td class=\"govuk-table__cell\" *ngIf=\"IS_BUTTON_ENABLE\">\n <div class=\"multiple-choice unprocessed-payments--radio-button\">\n <input id=\"'unpaiedFee'+i+''\"\n aria-label=\"unassignedRecord\"\n name=\"unassignedRecord\"\n type=\"radio\"\n [(ngModel)]=\"recordId\"\n (click)=\"unprocessedPaymentSelectEvent(unassignedRecord.dcn_reference)\"\n value=\"{{unassignedRecord.dcn_reference}}\" />\n <label for=\"radio-inline-1\"></label>\n </div>\n </td>\n <td class=\"govuk-table__cell whitespace-inherit\">\n {{unassignedRecord.dcn_reference}}\n </td>\n <td class=\"govuk-table__cell whitespace-inherit\"> {{unassignedRecord.date_banked | date:'dd MMM yyyy'}}</td>\n <td class=\"govuk-table__cell whitespace-inherit\"> {{unassignedRecord.amount | currency :'GBP':'symbol':'1.2-2'}}</td>\n <td class=\"capitalize govuk-table__cell whitespace-inherit\"> {{ trimUnderscore(unassignedRecord.payment_method) | lowercase}} </td>\n </tr>\n </tbody>\n <tbody class=\"govuk-table__body\" *ngIf=\"upPaymentErrorMessage !== null\">\n <td class=\"govuk-table__cell\" colspan=\"6\">No unallocated payments record available</td>\n </tbody>\n </table>\n <div class=\"button-grb\" *ngIf=\"IS_BUTTON_ENABLE && !isTurnOff\">\n <button type=\"button\"\n [disabled]=\"!isAllocatedToNewFeebtnEnabled\"\n [ngClass]=\"!isAllocatedToNewFeebtnEnabled ? 'button govuk-button--secondary button--disabled govuk-!-margin-right-1' : 'button govuk-button--secondary govuk-!-margin-right-1'\" (click)=\"redirectToFeeSearchPage($event)\">\n Allocate to a new fee\n </button>\n <button type=\"button\" \n [disabled]=\"!isAllocateToExistingFeebtnEnabled\"\n [ngClass]='!isAllocateToExistingFeebtnEnabled ? \"button govuk-button--secondary button--disabled govuk-!-margin-right-1\" : \"button govuk-button--secondary govuk-!-margin-right-1\"' (click)=\"goToAllocatePage()\">\n Allocate to an existing fee\n </button>\n <button type=\"button\" \n [disabled]=\"!isMarkAsUnidentifiedbtnEnabled\"\n [ngClass]='!isMarkAsUnidentifiedbtnEnabled ? \"button govuk-button--secondary button--disabled govuk-!-margin-right-1\" : \"button govuk-button--secondary govuk-!-margin-right-1\"' (click)=\"loadUnsolicitedPage('unidentifiedPage')\">\n Mark as unidentified\n </button>\n <button type=\"button\" \n [disabled]=\"!isUnprocessedRecordSelected\"\n [ngClass]='!isUnprocessedRecordSelected ? \"button govuk-button--secondary button--disabled govuk-!-margin-right-1\" : \"button govuk-button--secondary govuk-!-margin-right-1\"' (click)=\"loadUnsolicitedPage('unsolicitedPage')\">\n Mark as transferred\n </button> \n </div>\n \n <div class=\"button-grb\" *ngIf=\"IS_BUTTON_ENABLE && isTurnOff\">\n <button type=\"button\"\n [disabled]=\"!isAllocatedToNewFeebtnEnabled\"\n [ngClass]=\"!isAllocatedToNewFeebtnEnabled ? 'button button--disabled govuk-!-margin-right-1' : 'button govuk-!-margin-right-1'\" (click)=\"redirectToFeeSearchPage($event)\">\n Allocate to a new fee\n </button>\n <button type=\"button\" \n [disabled]=\"!isAllocateToExistingFeebtnEnabled\"\n [ngClass]='!isAllocateToExistingFeebtnEnabled ? \"button button--disabled govuk-!-margin-right-1\" : \"button govuk-!-margin-right-1\"' (click)=\"goToAllocatePage()\">\n Allocate to an existing fee\n </button>\n <button type=\"button\" \n [disabled]=\"!isMarkAsUnidentifiedbtnEnabled\"\n [ngClass]='!isMarkAsUnidentifiedbtnEnabled ? \"button button--disabled govuk-!-margin-right-1\" : \"button govuk-!-margin-right-1\"' (click)=\"loadUnsolicitedPage('unidentifiedPage')\">\n Mark as unidentified\n </button>\n <button type=\"button\" \n [disabled]=\"!isUnprocessedRecordSelected\"\n [ngClass]='!isUnprocessedRecordSelected ? \"button button--disabled govuk-!-margin-right-1\" : \"button govuk-!-margin-right-1\"' (click)=\"loadUnsolicitedPage('unsolicitedPage')\">\n Mark as transferred\n </button> \n </div>\n </div>\n</ng-container> -->\n\n\n<ng-container *ngIf=\"!IS_BUTTON_ENABLE\">\n <table class=\"govuk-table\">\n \n <thead class=\"govuk-table__head\" *ngIf='PAYMENTSLENGTH === 0 '>\n <!-- <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header col-14\" scope=\"col\">Status</td>\n <td class=\"govuk-table__header col-10\" scope=\"col\">Amount</td>\n <td class=\"govuk-table__header col-14\" scope=\"col\">Date</td>\n <td class=\"govuk-table__header col-20\" scope=\"col\">Request reference</td>\n <td class=\"govuk-table__header col-9\" scope=\"col\"></td>\n <td class=\"govuk-table__header\" scope=\"col\"></td>\n </tr> -->\n </thead>\n <tbody class=\"govuk-table__body\">\n <tr class=\"govuk-table__row\" *ngFor=\"let unassignedRecord of unassignedRecordList; let i = index;\">\n <td class=\"govuk-table__cell whitespace-inherit\" class=\"col-13\">\n Unallocated \n </td>\n <td class=\"govuk-table__cell whitespace-inherit\"> {{unassignedRecord.amount | currency :'GBP':'symbol':'1.2-2'}}</td>\n <td class=\"govuk-table__cell whitespace-inherit\"></td>\n <td class=\"govuk-table__cell whitespace-inherit\"></td>\n <td class=\"govuk-table__cell whitespace-inherit\"></td>\n <td class=\"govuk-table__cell whitespace-inherit\"></td>\n </tr>\n </tbody>\n \n </table>\n\n</ng-container>\n\n\n<!--Orders Unallocated changes-->\n<ng-container *ngIf=\"IS_BUTTON_ENABLE\">\n <div class=\"unprocessed-payments\">\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='CASETRANSACTION'>\n <table class=\"table\">\n \n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header col-13\" scope=\"col\">Status</td>\n <td class=\"govuk-table__header col-9\" scope=\"col\">Amount</td>\n <td class=\"govuk-table__header col-16\" scope=\"col\">Date allocated</td>\n <td class=\"govuk-table__header col-24\" colspan=\"3\" scope=\"col\">Request reference</td>\n <td class=\"govuk-table__header col-13\" scope=\"col\"></td>\n <td class=\"govuk-table__header\" scope=\"col\"></td>\n </tr>\n </thead>\n <tbody>\n <ng-container *ngFor=\"let unassignedRecord of unassignedRecordList; let i = index;\">\n <tr>\n <td class=\"govuk-table__cell whitespace-inherit col-13\" >\n Unallocated \n </td>\n <td class=\"govuk-table__cell whitespace-inherit col-10\">\n {{unassignedRecord.amount | currency :'GBP':'symbol':'1.2-2'}}\n </td>\n <td class=\"govuk-table__cell whitespace-inherit\" colspan=\"8\">\n <div *ngIf=\"IS_BUTTON_ENABLE && !isTurnOff\" class=\"alignright\">\n <button type=\"button\"\n [disabled]=\"!isAllocatedToNewFeebtnEnabled\"\n [ngClass]=\"!isAllocatedToNewFeebtnEnabled ? 'button govuk-button--secondary button--disabled' : 'button govuk-button--secondary'\" (click)=\"redirectToFeeSearchPage($event,unassignedRecord.dcn_reference)\">\n Allocate to new service request\n </button><br/>\n <button type=\"button\" \n [disabled]=\"!isAllocateToExistingFeebtnEnabled\"\n [ngClass]='!isAllocateToExistingFeebtnEnabled ? \"button govuk-button--secondary button--disabled\" : \"button govuk-button--secondary\"' (click)=\"goToAllocatePage(unassignedRecord.dcn_reference)\">\n Allocate to existing service request \n </button>\n </div>\n \n </td>\n </tr>\n \n <!-- <ng-container> -->\n <tr>\n <td class=\"unassigned noborders\" colspan=\"10\">\n <summary (click)=\"unassignedRecord.expanded = !unassignedRecord.expanded\" class=\"govuk-details__summary\">\n <span class=\"govuk-details__summary-text\">\n More details and actions\n </span>\n </summary>\n <div *ngIf=\"unassignedRecord.expanded\" class=\"govuk-details__text govuk-!-margin-bottom-5 paddingright\">\n <dl class=\"govuk-summary-list govuk-!-margin-bottom-5\">\n <div class=\"govuk-summary-list__row\">\n <dt class=\"govuk-summary-list__key\">\n Method\n </dt>\n <dd class=\"govuk-summary-list__value\">\n {{ trimUnderscore(unassignedRecord.payment_method) | lowercase}}\n </dd>\n </div>\n <div class=\"govuk-summary-list__row\">\n <dt class=\"govuk-summary-list__key\">\n Payment assest number (DCN) \n </dt>\n <dd class=\"govuk-summary-list__value\">\n {{unassignedRecord.dcn_reference}}\n </dd>\n </div>\n </dl>\n <div class=\" govuk-!-margin-bottom-5\">\n <button type=\"button\" \n [disabled]=\"!isMarkAsUnidentifiedbtnEnabled\"\n [ngClass]='!isMarkAsUnidentifiedbtnEnabled ? \"button govuk-button--secondary button--disabled\" : \"button govuk-button--secondary\"' (click)=\"loadUnsolicitedPage('unidentifiedPage',unassignedRecord.dcn_reference)\">\n Mark as unidentified\n </button>\n </div>\n <div>\n <button type=\"button\" \n [disabled]=\"!isUnprocessedRecordSelected\"\n [ngClass]='!isUnprocessedRecordSelected ? \"button govuk-button--secondary button--disabled\" : \"button govuk-button--secondary\"' (click)=\"loadUnsolicitedPage('unsolicitedPage',unassignedRecord.dcn_reference)\">\n Mark as transferred\n </button> \n </div>\n\n </div>\n </td> \n </tr> \n <!-- </ng-container> -->\n </ng-container>\n </tbody>\n </table>\n \n </div>\n</ng-container>\n\n<ng-container *ngIf=\"viewStatus === 'main'\">\n\n</ng-container>\n<!-- <ng-container *ngIf=\"PAYMENTSLENGTH === 0 && unassignedRecordListLength === 0\">\n <br/>No payments.<br/>\n</ng-container> -->\n\n", styles: [".unprocessed-payments .unprocessed-payments--radio-button{bottom:10px}.disable{text-decoration:none;padding:.526315em .789473em .263157em;cursor:default;color:#fff;background-color:#00823b;pointer-events:none;font-size:1em;line-height:1.25;outline:1px solid transparent;outline-offset:-1px;-webkit-appearance:none;box-shadow:0 2px #003618}.button.disabled,.button[disabled=disabled],.button[disabled]{zoom:1;filter:alpha(opacity=50);opacity:.5}.button.disabled:active,.button[disabled=disabled]:active,.button[disabled]:active{top:0;-webkit-box-shadow:0 2px 0 #003618;-moz-box-shadow:0 2px 0 #003618;box-shadow:0 2px #003618}.button[disabled=disabled]{background:#00823b}.col-13{width:13%!important}.col-17{width:17%!important}.col-12{width:12%!important}.col-9{width:9%!important}.col-15{width:15%!important}.lowercase{text-transform:lowercase}.capitalize:first-letter{text-transform:uppercase}.whitespace-inherit{white-space:inherit!important}.top_row{display:table;width:100%}.top_row>div{display:table-cell;width:50%;border-bottom:1px solid #eee}.unassigned{border-top:hidden}.col-16{width:16%!important}.col-10{width:10%!important}.col-14{width:14%!important}.col-19{width:19%!important;padding-left:0!important}.col-18{width:18%!important;padding-left:0!important;padding-right:0!important}.col-21{width:21%!important}.col-20{width:20%!important}.col-11{width:11%!important}.col-37{width:37%!important}.noborders>td{border-color:transparent;border-top-style:hidden;border-right-style:hidden;border-left-style:hidden}.govuk-button--secondary{margin-bottom:10px}.govuk-summary-list{font-size:19px}.govuk-summary-list__key{width:35%}td{white-space:nowrap;overflow:hidden!important}table{table-layout:fixed;width:100%}th,td{word-wrap:break-word}.alignright{text-align:right}.paddingright{padding-right:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i3.LowerCasePipe, name: "lowercase" }, { kind: "pipe", type: i3.CurrencyPipe, name: "currency" }] });
1484
1486
  }
1485
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: UnprocessedPaymentsComponent, decorators: [{
1487
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: UnprocessedPaymentsComponent, decorators: [{
1486
1488
  type: Component,
1487
1489
  args: [{ selector: 'ccpay-app-unprocessed-payments', imports: [CommonModule], standalone: true, template: "<!-- <ng-container *ngIf=\"IS_BUTTON_ENABLE\">\n <div class=\"unprocessed-payments govuk-grid-column-full govuk-!-padding-bottom-3\">\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='CASETRANSACTION'>\n <h3 class=\"heading-medium\" *ngIf=\"!IS_BUTTON_ENABLE\">Unprocessed payments</h3>\n <h3 class=\"heading-medium\" *ngIf=\"IS_BUTTON_ENABLE\">Unallocated payments</h3>\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\" *ngIf=\"IS_BUTTON_ENABLE && !isTurnOff\">Select</td>\n <td class=\"govuk-table__header\" scope=\"col\" *ngIf=\"IS_BUTTON_ENABLE && isTurnOff\"><a href=\"#\" (click)=\"unprocessedPaymentUnSelectEvent($event)\">Unselect</a></td>\n \n <td class=\"govuk-table__header\" scope=\"col\">Payment asset number (DCN)</td>\n <td class=\"govuk-table__header\" scope=\"col\">Banked date</td>\n <td class=\"govuk-table__header\" scope=\"col\">Amount</td>\n <td class=\"govuk-table__header\" scope=\"col\">Method</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\" >\n <tr class=\"govuk-table__row\" *ngFor=\"let unassignedRecord of unassignedRecordList; let i of index;\">\n <td class=\"govuk-table__cell\" *ngIf=\"IS_BUTTON_ENABLE\">\n <div class=\"multiple-choice unprocessed-payments--radio-button\">\n <input id=\"'unpaiedFee'+i+''\"\n aria-label=\"unassignedRecord\"\n name=\"unassignedRecord\"\n type=\"radio\"\n [(ngModel)]=\"recordId\"\n (click)=\"unprocessedPaymentSelectEvent(unassignedRecord.dcn_reference)\"\n value=\"{{unassignedRecord.dcn_reference}}\" />\n <label for=\"radio-inline-1\"></label>\n </div>\n </td>\n <td class=\"govuk-table__cell whitespace-inherit\">\n {{unassignedRecord.dcn_reference}}\n </td>\n <td class=\"govuk-table__cell whitespace-inherit\"> {{unassignedRecord.date_banked | date:'dd MMM yyyy'}}</td>\n <td class=\"govuk-table__cell whitespace-inherit\"> {{unassignedRecord.amount | currency :'GBP':'symbol':'1.2-2'}}</td>\n <td class=\"capitalize govuk-table__cell whitespace-inherit\"> {{ trimUnderscore(unassignedRecord.payment_method) | lowercase}} </td>\n </tr>\n </tbody>\n <tbody class=\"govuk-table__body\" *ngIf=\"upPaymentErrorMessage !== null\">\n <td class=\"govuk-table__cell\" colspan=\"6\">No unallocated payments record available</td>\n </tbody>\n </table>\n <div class=\"button-grb\" *ngIf=\"IS_BUTTON_ENABLE && !isTurnOff\">\n <button type=\"button\"\n [disabled]=\"!isAllocatedToNewFeebtnEnabled\"\n [ngClass]=\"!isAllocatedToNewFeebtnEnabled ? 'button govuk-button--secondary button--disabled govuk-!-margin-right-1' : 'button govuk-button--secondary govuk-!-margin-right-1'\" (click)=\"redirectToFeeSearchPage($event)\">\n Allocate to a new fee\n </button>\n <button type=\"button\" \n [disabled]=\"!isAllocateToExistingFeebtnEnabled\"\n [ngClass]='!isAllocateToExistingFeebtnEnabled ? \"button govuk-button--secondary button--disabled govuk-!-margin-right-1\" : \"button govuk-button--secondary govuk-!-margin-right-1\"' (click)=\"goToAllocatePage()\">\n Allocate to an existing fee\n </button>\n <button type=\"button\" \n [disabled]=\"!isMarkAsUnidentifiedbtnEnabled\"\n [ngClass]='!isMarkAsUnidentifiedbtnEnabled ? \"button govuk-button--secondary button--disabled govuk-!-margin-right-1\" : \"button govuk-button--secondary govuk-!-margin-right-1\"' (click)=\"loadUnsolicitedPage('unidentifiedPage')\">\n Mark as unidentified\n </button>\n <button type=\"button\" \n [disabled]=\"!isUnprocessedRecordSelected\"\n [ngClass]='!isUnprocessedRecordSelected ? \"button govuk-button--secondary button--disabled govuk-!-margin-right-1\" : \"button govuk-button--secondary govuk-!-margin-right-1\"' (click)=\"loadUnsolicitedPage('unsolicitedPage')\">\n Mark as transferred\n </button> \n </div>\n \n <div class=\"button-grb\" *ngIf=\"IS_BUTTON_ENABLE && isTurnOff\">\n <button type=\"button\"\n [disabled]=\"!isAllocatedToNewFeebtnEnabled\"\n [ngClass]=\"!isAllocatedToNewFeebtnEnabled ? 'button button--disabled govuk-!-margin-right-1' : 'button govuk-!-margin-right-1'\" (click)=\"redirectToFeeSearchPage($event)\">\n Allocate to a new fee\n </button>\n <button type=\"button\" \n [disabled]=\"!isAllocateToExistingFeebtnEnabled\"\n [ngClass]='!isAllocateToExistingFeebtnEnabled ? \"button button--disabled govuk-!-margin-right-1\" : \"button govuk-!-margin-right-1\"' (click)=\"goToAllocatePage()\">\n Allocate to an existing fee\n </button>\n <button type=\"button\" \n [disabled]=\"!isMarkAsUnidentifiedbtnEnabled\"\n [ngClass]='!isMarkAsUnidentifiedbtnEnabled ? \"button button--disabled govuk-!-margin-right-1\" : \"button govuk-!-margin-right-1\"' (click)=\"loadUnsolicitedPage('unidentifiedPage')\">\n Mark as unidentified\n </button>\n <button type=\"button\" \n [disabled]=\"!isUnprocessedRecordSelected\"\n [ngClass]='!isUnprocessedRecordSelected ? \"button button--disabled govuk-!-margin-right-1\" : \"button govuk-!-margin-right-1\"' (click)=\"loadUnsolicitedPage('unsolicitedPage')\">\n Mark as transferred\n </button> \n </div>\n </div>\n</ng-container> -->\n\n\n<ng-container *ngIf=\"!IS_BUTTON_ENABLE\">\n <table class=\"govuk-table\">\n \n <thead class=\"govuk-table__head\" *ngIf='PAYMENTSLENGTH === 0 '>\n <!-- <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header col-14\" scope=\"col\">Status</td>\n <td class=\"govuk-table__header col-10\" scope=\"col\">Amount</td>\n <td class=\"govuk-table__header col-14\" scope=\"col\">Date</td>\n <td class=\"govuk-table__header col-20\" scope=\"col\">Request reference</td>\n <td class=\"govuk-table__header col-9\" scope=\"col\"></td>\n <td class=\"govuk-table__header\" scope=\"col\"></td>\n </tr> -->\n </thead>\n <tbody class=\"govuk-table__body\">\n <tr class=\"govuk-table__row\" *ngFor=\"let unassignedRecord of unassignedRecordList; let i = index;\">\n <td class=\"govuk-table__cell whitespace-inherit\" class=\"col-13\">\n Unallocated \n </td>\n <td class=\"govuk-table__cell whitespace-inherit\"> {{unassignedRecord.amount | currency :'GBP':'symbol':'1.2-2'}}</td>\n <td class=\"govuk-table__cell whitespace-inherit\"></td>\n <td class=\"govuk-table__cell whitespace-inherit\"></td>\n <td class=\"govuk-table__cell whitespace-inherit\"></td>\n <td class=\"govuk-table__cell whitespace-inherit\"></td>\n </tr>\n </tbody>\n \n </table>\n\n</ng-container>\n\n\n<!--Orders Unallocated changes-->\n<ng-container *ngIf=\"IS_BUTTON_ENABLE\">\n <div class=\"unprocessed-payments\">\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='CASETRANSACTION'>\n <table class=\"table\">\n \n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header col-13\" scope=\"col\">Status</td>\n <td class=\"govuk-table__header col-9\" scope=\"col\">Amount</td>\n <td class=\"govuk-table__header col-16\" scope=\"col\">Date allocated</td>\n <td class=\"govuk-table__header col-24\" colspan=\"3\" scope=\"col\">Request reference</td>\n <td class=\"govuk-table__header col-13\" scope=\"col\"></td>\n <td class=\"govuk-table__header\" scope=\"col\"></td>\n </tr>\n </thead>\n <tbody>\n <ng-container *ngFor=\"let unassignedRecord of unassignedRecordList; let i = index;\">\n <tr>\n <td class=\"govuk-table__cell whitespace-inherit col-13\" >\n Unallocated \n </td>\n <td class=\"govuk-table__cell whitespace-inherit col-10\">\n {{unassignedRecord.amount | currency :'GBP':'symbol':'1.2-2'}}\n </td>\n <td class=\"govuk-table__cell whitespace-inherit\" colspan=\"8\">\n <div *ngIf=\"IS_BUTTON_ENABLE && !isTurnOff\" class=\"alignright\">\n <button type=\"button\"\n [disabled]=\"!isAllocatedToNewFeebtnEnabled\"\n [ngClass]=\"!isAllocatedToNewFeebtnEnabled ? 'button govuk-button--secondary button--disabled' : 'button govuk-button--secondary'\" (click)=\"redirectToFeeSearchPage($event,unassignedRecord.dcn_reference)\">\n Allocate to new service request\n </button><br/>\n <button type=\"button\" \n [disabled]=\"!isAllocateToExistingFeebtnEnabled\"\n [ngClass]='!isAllocateToExistingFeebtnEnabled ? \"button govuk-button--secondary button--disabled\" : \"button govuk-button--secondary\"' (click)=\"goToAllocatePage(unassignedRecord.dcn_reference)\">\n Allocate to existing service request \n </button>\n </div>\n \n </td>\n </tr>\n \n <!-- <ng-container> -->\n <tr>\n <td class=\"unassigned noborders\" colspan=\"10\">\n <summary (click)=\"unassignedRecord.expanded = !unassignedRecord.expanded\" class=\"govuk-details__summary\">\n <span class=\"govuk-details__summary-text\">\n More details and actions\n </span>\n </summary>\n <div *ngIf=\"unassignedRecord.expanded\" class=\"govuk-details__text govuk-!-margin-bottom-5 paddingright\">\n <dl class=\"govuk-summary-list govuk-!-margin-bottom-5\">\n <div class=\"govuk-summary-list__row\">\n <dt class=\"govuk-summary-list__key\">\n Method\n </dt>\n <dd class=\"govuk-summary-list__value\">\n {{ trimUnderscore(unassignedRecord.payment_method) | lowercase}}\n </dd>\n </div>\n <div class=\"govuk-summary-list__row\">\n <dt class=\"govuk-summary-list__key\">\n Payment assest number (DCN) \n </dt>\n <dd class=\"govuk-summary-list__value\">\n {{unassignedRecord.dcn_reference}}\n </dd>\n </div>\n </dl>\n <div class=\" govuk-!-margin-bottom-5\">\n <button type=\"button\" \n [disabled]=\"!isMarkAsUnidentifiedbtnEnabled\"\n [ngClass]='!isMarkAsUnidentifiedbtnEnabled ? \"button govuk-button--secondary button--disabled\" : \"button govuk-button--secondary\"' (click)=\"loadUnsolicitedPage('unidentifiedPage',unassignedRecord.dcn_reference)\">\n Mark as unidentified\n </button>\n </div>\n <div>\n <button type=\"button\" \n [disabled]=\"!isUnprocessedRecordSelected\"\n [ngClass]='!isUnprocessedRecordSelected ? \"button govuk-button--secondary button--disabled\" : \"button govuk-button--secondary\"' (click)=\"loadUnsolicitedPage('unsolicitedPage',unassignedRecord.dcn_reference)\">\n Mark as transferred\n </button> \n </div>\n\n </div>\n </td> \n </tr> \n <!-- </ng-container> -->\n </ng-container>\n </tbody>\n </table>\n \n </div>\n</ng-container>\n\n<ng-container *ngIf=\"viewStatus === 'main'\">\n\n</ng-container>\n<!-- <ng-container *ngIf=\"PAYMENTSLENGTH === 0 && unassignedRecordListLength === 0\">\n <br/>No payments.<br/>\n</ng-container> -->\n\n", styles: [".unprocessed-payments .unprocessed-payments--radio-button{bottom:10px}.disable{text-decoration:none;padding:.526315em .789473em .263157em;cursor:default;color:#fff;background-color:#00823b;pointer-events:none;font-size:1em;line-height:1.25;outline:1px solid transparent;outline-offset:-1px;-webkit-appearance:none;box-shadow:0 2px #003618}.button.disabled,.button[disabled=disabled],.button[disabled]{zoom:1;filter:alpha(opacity=50);opacity:.5}.button.disabled:active,.button[disabled=disabled]:active,.button[disabled]:active{top:0;-webkit-box-shadow:0 2px 0 #003618;-moz-box-shadow:0 2px 0 #003618;box-shadow:0 2px #003618}.button[disabled=disabled]{background:#00823b}.col-13{width:13%!important}.col-17{width:17%!important}.col-12{width:12%!important}.col-9{width:9%!important}.col-15{width:15%!important}.lowercase{text-transform:lowercase}.capitalize:first-letter{text-transform:uppercase}.whitespace-inherit{white-space:inherit!important}.top_row{display:table;width:100%}.top_row>div{display:table-cell;width:50%;border-bottom:1px solid #eee}.unassigned{border-top:hidden}.col-16{width:16%!important}.col-10{width:10%!important}.col-14{width:14%!important}.col-19{width:19%!important;padding-left:0!important}.col-18{width:18%!important;padding-left:0!important;padding-right:0!important}.col-21{width:21%!important}.col-20{width:20%!important}.col-11{width:11%!important}.col-37{width:37%!important}.noborders>td{border-color:transparent;border-top-style:hidden;border-right-style:hidden;border-left-style:hidden}.govuk-button--secondary{margin-bottom:10px}.govuk-summary-list{font-size:19px}.govuk-summary-list__key{width:35%}td{white-space:nowrap;overflow:hidden!important}table{table-layout:fixed;width:100%}th,td{word-wrap:break-word}.alignright{text-align:right}.paddingright{padding-right:0}\n"] }]
1488
1490
  }], ctorParameters: () => [{ type: i1$2.Router }, { type: BulkScaningPaymentService }, { type: PaymentViewService }, { type: OrderslistService }], propDecorators: { FEE_RECORDS_EXISTS: [{
@@ -1573,10 +1575,10 @@ class CcdHyphensPipe {
1573
1575
  }
1574
1576
  return value;
1575
1577
  }
1576
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: CcdHyphensPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
1577
- static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.1", ngImport: i0, type: CcdHyphensPipe, isStandalone: true, name: "ccdHyphens" });
1578
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: CcdHyphensPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
1579
+ static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.18", ngImport: i0, type: CcdHyphensPipe, isStandalone: true, name: "ccdHyphens" });
1578
1580
  }
1579
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: CcdHyphensPipe, decorators: [{
1581
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: CcdHyphensPipe, decorators: [{
1580
1582
  type: Pipe,
1581
1583
  args: [{
1582
1584
  name: 'ccdHyphens',
@@ -1589,10 +1591,10 @@ class CapitalizePipe {
1589
1591
  transform(s, args) {
1590
1592
  return s && s[0].toUpperCase() + s.slice(1) || "";
1591
1593
  }
1592
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: CapitalizePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
1593
- static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.1", ngImport: i0, type: CapitalizePipe, isStandalone: true, name: "capitalize" });
1594
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: CapitalizePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
1595
+ static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.18", ngImport: i0, type: CapitalizePipe, isStandalone: true, name: "capitalize" });
1594
1596
  }
1595
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: CapitalizePipe, decorators: [{
1597
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: CapitalizePipe, decorators: [{
1596
1598
  type: Pipe,
1597
1599
  args: [{
1598
1600
  name: 'capitalize',
@@ -2033,10 +2035,10 @@ class RefundStatusComponent {
2033
2035
  const status = this.refundlist?.refund_status?.name;
2034
2036
  return !!status && status !== 'Closed' && status !== 'Expired';
2035
2037
  }
2036
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: RefundStatusComponent, deps: [{ token: i1$1.FormBuilder }, { token: RefundsService }, { token: NotificationService }, { token: 'PAYMENT_LIB' }, { token: OrderslistService }, { token: PaymentViewService }], target: i0.ɵɵFactoryTarget.Component });
2037
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.1", type: RefundStatusComponent, isStandalone: true, selector: "ccpay-refund-status", inputs: { LOGGEDINUSERROLES: "LOGGEDINUSERROLES", API_ROOT: "API_ROOT", ccdCaseNumber: "ccdCaseNumber", isTurnOff: "isTurnOff", orderParty: "orderParty" }, ngImport: i0, template: "\n<div *ngIf=\"errorMessage\">\n <div class=\"error-summary\" role=\"group\" aria-labelledby=\"failure-error-summary-heading\" tabindex=\"-1\">\n <h2 class=\"heading-medium error-summary-heading\" id=\"failure-error-summary-heading\">\n Error in processing the request\n </h2>\n <div class=\"govuk-error-summary__body\">\n {{ errorMessage }}\n </div>\n </div>\n</div>\n\n<ng-container *ngIf=\"viewName==='refundstatuslist' && rejectedRefundList && !isResendOperationSuccess && !isEditDetailsClicked\">\n <!-- payments -->\n\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header col-16\" scope=\"col\">Status</td>\n <td class=\"govuk-table__header col-11\" scope=\"col\">Amount</td>\n <td class=\"govuk-table__header col-18\" scope=\"col\">Date</td>\n <td class=\"govuk-table__header col-25\" scope=\"col\">Refund reference</td>\n <td class=\"govuk-table__header col-24 \" scope=\"col\">Reason</td>\n <td class=\"govuk-table__header\" scope=\"col\"></td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\" *ngIf=\"rejectedRefundList?.length > 0\">\n <tr class=\"govuk-table__row\" *ngFor=\"let refundList of rejectedRefundList\">\n <td class=\"govuk-table__cell whitespace-inherit\">{{ refundList?.refund_status['name'] }}</td>\n <td class=\"channel govuk-table__cell whitespace-inherit\">\u00A3{{ refundList?.amount | number:'.2' }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ refundList?.date_updated | date:'dd MMM yyyy'}}\n </td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ refundList?.refund_reference }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\"> {{refundList?.reason}}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">\n <a href=\"javascript:void(0)\" (click)=\"goToRefundView(refundList,'casetransactions')\">Review</a>\n </td>\n </tr>\n </tbody>\n <tbody class=\"govuk-table__body\" *ngIf=\"rejectedRefundList?.length === 0\">\n <td class=\"govuk-table__cell\" colspan=\"6\">No refunds recorded</td>\n </tbody>\n </table>\n</ng-container>\n\n<ng-container *ngIf=\"viewName==='refundview' && !isResendOperationSuccess && !isEditDetailsClicked\">\n <div class=\"govuk-breadcrumbs\">\n <ol class=\"govuk-breadcrumbs__list\">\n <li class=\"govuk-breadcrumbs__list-item\">\n <a href=\"javascript:void(0)\" (click)=\"loadRefundListPage()\" class=\"govuk-back-link govuk-label\">Back</a>\n </li>\n </ol>\n </div>\n <h2 class=\"govuk-heading-l\">Refund details</h2>\n <table>\n\n <tbody>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">Refund reference</td>\n <td>{{ refundlist?.refund_reference }}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">Payment to be refunded</td>\n <td>{{refundlist?.payment_reference }}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">Reason for refund</td>\n <td>{{ refundlist?.reason }}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">Amount refunded</td>\n <td>\u00A3{{refundlist?.amount | number:'.2' }}</td>\n </tr>\n\n </tbody>\n </table>\n\n\n <!-- Notification sent details -->\n <div>\n <br />\n <h2 class=\"govuk-heading-m\">Notifications sent</h2>\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header col-24 whitespace-inherit\" scope=\"col\">Date and time</td>\n <td class=\"govuk-table__header col-27 whitespace-inherit\" scope=\"col\">Sent to</td>\n <td class=\"govuk-table__header whitespace-inherit\" scope=\"col\">Sent via</td>\n <td class=\"govuk-table__header whitespace-inherit\" scope=\"col\">Actions</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\" *ngIf=\"notificationList\">\n <ng-container *ngFor=\"let notification of notificationList; let i = index;\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell whitespace-inherit\">{{notification.date_created | date:'dd MMMM yyyy HH:mm:ss'}}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{orderParty}}</td>\n <td class=\"govuk-table__cell whitespace-inherit col-40\">\n <div *ngIf=\"notification?.notification_type === 'EMAIL'\">\n <strong>Email</strong><br>\n {{notification?.contact_details?.email?.trim()}}\n </div>\n <div *ngIf=\"notification?.notification_type === 'LETTER'\">\n <strong>Post</strong><br>\n {{notification?.contact_details?.address_line?.trim()}} {{notification?.contact_details?.city?.trim()}} {{notification?.contact_details?.county?.trim()}} {{notification?.contact_details?.country?.trim()}} {{notification?.contact_details?.postal_code?.trim()}}\n </div>\n </td>\n\n <td class=\"govuk-table__cell whitespace-inherit\" *ngIf=\"i === 0\">\n\n <a *ngIf=\"isCurrentRefundInProcess()\" href=\"Javascript:void(0);\" (click)=\"putResend(notification)\">Resend</a><span *ngIf=\"isCurrentRefundInProcess()\">&nbsp;|&nbsp;</span>\n <a *ngIf=\"isCurrentRefundInProcess()\"href=\"Javascript:void(0);\" (click)=\"gotoEditAddressDetails(notification)\">Edit details</a><span *ngIf=\"isCurrentRefundInProcess()\">&nbsp;|&nbsp;</span>\n <a *ngIf=\"!notificationSentView || i != notificationSentViewIndex\" href=\"Javascript:void(0);\" (click)=\"showNotificationSentView(i)\">View</a>\n <a *ngIf=\"i === notificationSentViewIndex && notificationSentView\" href=\"Javascript:void(0);\" (click)=\"hideNotificationSentView()\">Hide</a>\n\n </td>\n\n <td class=\"govuk-table__cell whitespace-inherit\" *ngIf=\"i > 0\"><a *ngIf=\"!notificationSentView || i != notificationSentViewIndex\" href=\"Javascript:void(0);\" (click)=\"showNotificationSentView(i)\">View</a><a *ngIf=\"i === notificationSentViewIndex && notificationSentView\" href=\"Javascript:void(0);\" (click)=\"hideNotificationSentView()\">Hide</a></td>\n </tr>\n <tr *ngIf=\"i === notificationSentViewIndex && notificationSentView\">\n <td class=\"govuk-table__cell\" colspan=\"4\">\n <app-notification-preview\n [previewJourney]=\"'Notifications sent'\" [notificationSent]=\"notification?.sent_notification\">\n </app-notification-preview>\n </td>\n </tr>\n </ng-container>\n\n </tbody>\n <tbody class=\"govuk-table__body\" *ngIf=\"!notificationList\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell whitespace-inherit\" colspan=\"4\">No record found ... </td>\n </tr>\n </tbody>\n </table>\n </div>\n <!-- Status history -->\n <div>\n <br />\n <div class=\"refund-status-history-header govuk-flex\">\n <h2 class=\"govuk-heading-m\">Refund status history</h2>\n <div *ngIf=\"isCurrentRefundVisibleForReset()\">\n <button\n type=\"button\"\n [disabled]=\"isRefundStatusResetBtnDisabled\"\n class=\"govuk-button govuk-button--secondary\"\n (click)=\"displayResetRefundConfirmation()\">\n Reset Refund\n </button>\n </div>\n </div>\n <div *ngIf=\"refundStatusHistories\">\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header col-24 whitespace-inherit\" scope=\"col\">Status</td>\n <td class=\"govuk-table__header col-27 whitespace-inherit\" scope=\"col\">Date and time</td>\n <td class=\"govuk-table__header whitespace-inherit\" scope=\"col\">Users</td>\n <td class=\"govuk-table__header whitespace-inherit\" scope=\"col\">Notes</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\" *ngFor=\"let refundStatusHistory of refundStatusHistories;\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell whitespace-inherit\">{{refundStatusHistory.status}}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">\n {{refundStatusHistory.date_created | date:'dd MMMM yyyy HH:mm:ss'}}\n </td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{refundStatusHistory.created_by}}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{refundStatusHistory.notes}}</td>\n </tr>\n </tbody>\n </table>\n </div>\n\n </div>\n\n <ng-container *ngIf=\"viewName==='refundview' && !isFromPayBubble && !isResendOperationSuccess && !isEditDetailsClicked\">\n <div *ngIf=\"refundButtonState==='Update required'\" >\n <!-- <div *ngIf=\"refundButtonState==='sent back'\"> -->\n <br />\n <button type=\"submit\" class=\"button govuk-button--secondary btnmargin\"\n (click)=\"gotoReviewAndReSubmitPage()\">Change refund details</button>\n </div>\n <div *ngIf=\"isProcessRefund && !isLastUpdatedByCurrentUser && refundButtonState==='Sent for approval'\" >\n <!-- <div *ngIf=\"isProcessRefund && !isLastUpdatedByCurrentUser && refundButtonState==='sent for approval'\"> -->\n <br />\n <button type=\"submit\" class=\"button govuk-button--secondary\"\n (click)=\"goToRefundProcessComponent(refundlist.refund_reference,refundlist)\">Process refund</button>\n </div>\n </ng-container>\n\n\n</ng-container>\n\n<ng-container *ngIf=\"viewName==='reviewandsubmitview' && !isResendOperationSuccess && !isEditDetailsClicked\">\n <!-- <div class=\"govuk-breadcrumbs\">\n <ol class=\"govuk-breadcrumbs__list\">\n <li class=\"govuk-breadcrumbs__list-item\">\n <a (click)=\"gotoReviewDetailsPage($event)\" class=\"govuk-back-link govuk-label\">Back</a>\n </li>\n </ol>\n </div> -->\n <div class=\"govuk-warning-text\">\n <h1 class=\"heading-large\">Check your answers</h1>\n </div>\n <table class=\"govuk-table\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">Payment reference</td>\n <td class=\"govuk-table__cell\">{{ refundlist?.payment_reference}} </td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">Reason for return</td>\n <td class=\"govuk-table__cell\">{{refundreason}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">Refund reference</td>\n <td class=\"govuk-table__cell\">{{ refundlist?.refund_reference}} </td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">Reason for refund</td>\n <td class=\"govuk-table__cell\">{{ refundlist?.reason?.trim()}}\n <a (click)=\"gotoRefundReasonPage(refundlist?.reason)\" *ngIf=\"refundlist?.reason !== 'Retrospective remission' && refundlist?.reason !== 'Overpayment'\"\n class=\"govuk-link right\">Change</a>\n </td>\n\n <!-- <td class=\"govuk-table__cell\">{{ refundlist?.reason }}</td>\n <a (click)=\"gotoRefundReasonPage()\" class=\"govuk-link right\">Change</a> -->\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">Refund amount</td>\n <td class=\"govuk-table__cell\">\u00A3{{ changedAmount ? changedAmount : refundlist?.amount | number:'.2' }}\n <a (click)=\"gotoAmountPage()\" *ngIf=\"refundlist?.reason !== 'Overpayment'\"\n class=\"govuk-link right\">Change</a>\n </td>\n\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">Send to</td>\n <td class=\"govuk-table__cell\">{{orderParty}} </td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">Send via</td>\n <td class=\"govuk-table__cell whitespace-inherit\">\n <div *ngIf=\"refundlist?.contact_details?.notification_type === 'EMAIL'\" class=\"contactDetails-width font-size-19px\">\n <strong>Email</strong>\n <br/>\n {{refundlist?.contact_details?.email?.trim()}}\n </div>\n <div *ngIf=\"refundlist?.contact_details?.notification_type === 'LETTER'\" class=\"contactDetails-width font-size-19px\">\n <strong>Post</strong>\n <br/>\n {{refundlist?.contact_details?.address_line?.trim()}} {{refundlist?.contact_details?.city?.trim()}} {{refundlist?.contact_details?.county?.trim()}} {{refundlist?.contact_details?.country?.trim()}} {{refundlist?.contact_details?.postal_code?.trim()}}\n </div>\n <a class=\"govuk-link\" href=\"Javascript:void(0)\" *ngIf=\"refundlist?.contact_details !=null\" class=\"govuk-link right\" (click)=\"gotoEditDetailsPage(refundlist?.contact_details, 'reviewandsubmitEditview')\">\n Change\n </a>\n </td>\n </tr>\n\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">Notification</td>\n <td class=\"govuk-table__cell\">{{templateInstructionType}}\n <a *ngIf=\"!notificationPreview\" href=\"Javascript:void(0)\" class=\"govuk-link right\" (click)=\"showNotificationPreview()\">\n Preview\n </a>\n <a *ngIf=\"notificationPreview\" href=\"Javascript:void(0)\" class=\"govuk-link right\" (click)=\"hideNotificationPreview()\">\n Hide Preview\n </a>\n </td>\n </tr>\n </table>\n <app-notification-preview *ngIf=\"notificationPreview\"\n [paymentReference]=\"refundlist?.payment_reference\"\n [payment]=\"paymentObj\"\n [contactDetails]=\"refundlist?.contact_details\"\n [refundReason]=\"refundlist?.reason_code\"\n [refundAmount]=\"changedAmount ? changedAmount : refundlist?.amount\"\n [refundReference]=\"refundlist?.refund_reference\"></app-notification-preview>\n\n <div class=\"govuk-button-group\">\n <button (click)=\"gotoReviewDetailsPage($event)\" class=\"govuk-button govuk-button--secondary\"> Previous</button>\n <button [disabled]=\"isRefundBtnDisabled\" (click)=\"gotoReviewRefundConfirmationPage()\" class=\"govuk-button button\"\n data-module=\"govuk-button\">\n Submit refund\n </button>\n</div>\n<p><a href=\"javascript:void(0)\" (click)=\"loadRefundListPage()\" class=\"govuk-link\" data-module=\"govuk-button\">Cancel</a></p>\n <!-- <div class=\"govuk-button-group\">\n <button [disabled]=\"isRefundBtnDisabled\" (click)=\"gotoReviewRefundConfirmationPage()\" class=\"govuk-button button\"\n data-module=\"govuk-button\">\n Submit refund\n </button>\n </div> -->\n <!-- <p>\n <a (click)=\"loadRefundListPage()\" href=\"\" class=\"cancelbtn\">Cancel</a>\n </p> -->\n</ng-container>\n\n<ng-container *ngIf=\"viewName === 'reviewandsubmitEditview' && isEditDetailsClicked\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='EDITDETAILSPAGE'>\n <h1 class=\"govuk-heading-l\">Edit contact details</h1>\n <h2 class=\"govuk-heading-m govuk-font19px\">Case reference: {{ccdCaseNumber | ccdHyphens }}</h2>\n <span class=\"govuk-hint font-size-19px\">\n Refund reference: {{ refundlist?.refund_reference}}\n </span>\n <ccpay-contact-details\n [isEditOperationInRefundList] = isEditDetailsClicked\n [addressObj] = notification\n (assignContactDetailsInFefundsList)=\"getContactDetailsForRefundList($event)\"\n (redirectToIssueRefund)=\"gotoRefundReviewAndSubmitViewPageCancelBtnClicked($event)\" ></ccpay-contact-details>\n <p>\n <a (click)=\"loadRefundListPage()\" class=\"govuk-link\" data-module=\"govuk-button\">\n Cancel\n </a>\n </p>\n\n</ng-container>\n\n<ng-container *ngIf=\"viewName === 'issuerefundpage1' && !isResendOperationSuccess && !isEditDetailsClicked\">\n <ccpay-add-remission [isFromRefundListPage]=\"true\" [viewCompStatus]=\"viewName\" [isRefundRemission]=\"true\" [isFromRefundStatusPage] = \"true\"\n [changeRefundReason]= \"changeRefundReason\" [ccdCaseNumber]=\"ccdCaseNumber\" (refundListReason)=\"getRefundListReason($event)\" [refundPaymentReference]= \"refundlist?.payment_reference\" ></ccpay-add-remission>\n</ng-container>\n\n<ng-container *ngIf=\"viewName === 'processretroremissonpage' && !isResendOperationSuccess && !isEditDetailsClicked\">\n <ccpay-add-remission [isFromRefundListPage]=\"true\" [viewCompStatus]=\"viewName\" [isRefundRemission]=\"true\"\n [ccdCaseNumber]=\"ccdCaseNumber\" [refundPaymentReference]= \"refundlist?.payment_reference\" (refundListAmount)=\"getRefundAmount($event)\"></ccpay-add-remission>\n</ng-container>\n\n<ng-container *ngIf=\"viewName === 'issuerefund' && !isResendOperationSuccess && !isEditDetailsClicked\">\n <ccpay-add-remission [isFromRefundListPage]=\"true\" [viewCompStatus]=\"viewName\" [isRefundRemission]=\"true\" [isFromServiceRequestPage] = \"true\"\n [ccdCaseNumber]=\"ccdCaseNumber\" [refundPaymentReference]= \"refundlist?.payment_reference\" [isFromRefundStatusPage]=\"true\" (refundListAmount)=\"getRefundAmount($event)\" (refundFees)=\"getRefundFees($event)\"></ccpay-add-remission>\n</ng-container>\n\n<ng-container *ngIf=\"viewName === 'reviewrefundconfirmationpage' && !isResendOperationSuccess && !isEditDetailsClicked\">\n <div class=\"govuk-grid-row pagesize\">\n <div>\n <div class=\"govuk-panel govuk-panel--confirmation\">\n <h1 class=\"govuk-panel_refund_title\">\n Refund submitted\n </h1>\n\n <div class=\"govuk-panel__body\">\n <p class=\"govuk-body white\"><strong class=\"white\">Refund reference:{{refundReference}} </strong></p>\n </div>\n\n </div>\n\n <h2 class=\"govuk-heading-l\">What happens next</h2>\n <p class=\"govuk-body\">\n A refund request for {{refundAmount| currency:'GBP':'symbol-narrow':'1.2-2'}} has been created and will be passed to a team leader to approve.\n </p>\n\n <p class=\"govuk-body\">\n <a href=\"javascript:void(0)\" (click)=\"loadRefundListPage()\" class=\"govuk-link\">Return to case</a>\n </p>\n </div>\n </div>\n</ng-container>\n\n<ng-container *ngIf=\"isResendOperationSuccess\">\n <div class=\"govuk-grid-row pagesize\">\n <div>\n <div class=\"govuk-panel govuk-panel--confirmation\">\n <h1 class=\"govuk-panel_refund_title\">\n Notification sent\n </h1>\n\n <div class=\"govuk-panel__body\">\n <p class=\"govuk-body white\"><strong class=\"white\">Refund reference: {{ refundlist?.refund_reference}} </strong></p>\n </div>\n\n </div>\n <p class=\"govuk-body\">\n <a href=\"javascript:void(0)\" (click)=\"loadRefundListPage()\" class=\"govuk-link\">Return to case</a>\n </p>\n </div>\n </div>\n</ng-container>\n<ng-container *ngIf=\"viewName === 'refundEditView' && isEditDetailsClicked\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='EDITDETAILSPAGE'>\n <h1 class=\"govuk-heading-l\">Edit contact details</h1>\n <h2 class=\"govuk-heading-m govuk-font19px\">Case reference: {{ccdCaseNumber | ccdHyphens }}</h2>\n <span class=\"govuk-hint font-size-19px\">\n Refund reference: {{ refundlist?.refund_reference}}\n </span>\n <ccpay-contact-details\n [isEditOperationInRefundList] = isEditDetailsClicked\n [addressObj] = notification\n (assignContactDetailsInFefundsList)=\"getContactDetails($event)\"\n (redirectToIssueRefund)=\"gotoRefundViewPageCancelBtnClicked($event)\" ></ccpay-contact-details>\n <p>\n <a (click)=\"loadRefundListPage()\" class=\"govuk-link\" data-module=\"govuk-button\">\n Cancel\n </a>\n </p>\n\n</ng-container>\n<ng-container *ngIf=\"viewName === 'revieweditdetailsconfirmationpage' && !isResendOperationSuccess && isEditDetailsClicked\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='EDITDETAILSCHECKANDANSWERPAGE'>\n <h1 class=\"govuk-heading-l\">Check your answers</h1>\n <dl class=\"govuk-summary-list\">\n <div class=\"govuk-summary-list__row font-size-19px\">\n <dt class=\"govuk-summary-list__key\">\n Refund reference\n </dt>\n <dd class=\"govuk-summary-list__value\">\n {{ refundlist?.refund_reference}}\n </dd>\n <span class=\"govuk-summary-list__actions\"></span>\n </div>\n <div class=\"govuk-summary-list__row font-size-19px\">\n <dt class=\"govuk-summary-list__key\">\n Send via\n <br/>\n </dt>\n <dd class=\"govuk-summary-list__value\">\n <div *ngIf=\"addressDetails?.notification_type === 'EMAIL'\" class=\"contactDetails-width font-size-19px\">\n <strong>Email</strong>\n <br/>\n {{addressDetails?.email?.trim()}}\n </div>\n <div *ngIf=\"addressDetails?.notification_type === 'LETTER'\" class=\"contactDetails-width font-size-19px\">\n <strong>Post</strong>\n <br/>\n {{addressDetails?.address_line?.trim()}} {{addressDetails?.city?.trim()}} {{addressDetails?.county?.trim()}} {{addressDetails?.country?.trim()}} {{addressDetails?.postal_code?.trim()}}\n </div>\n </dd>\n <dd class=\"govuk-summary-list__actions\">\n <a class=\"govuk-link\" href=\"Javascript:void(0)\" (click)=\"gotoEditDetailsPage(addressDetails, 'refundEditView')\">\n Change\n </a>\n </dd>\n </div>\n <div class=\"govuk-summary-list__row font-size-19px\">\n <dt class=\"govuk-summary-list__key\">\n Notification\n </dt>\n <dd class=\"govuk-summary-list__value\">\n {{templateInstructionType}}\n </dd>\n <span class=\"govuk-summary-list__actions\">\n <a *ngIf=\"!notificationPreview\" href=\"Javascript:void(0)\" class=\"govuk-link right\" (click)=\"showNotificationPreview()\">\n Preview\n </a>\n <a *ngIf=\"notificationPreview\" href=\"Javascript:void(0)\" class=\"govuk-link right\" (click)=\"hideNotificationPreview()\">\n Hide Preview\n </a>\n </span>\n </div>\n </dl>\n\n <app-notification-preview *ngIf=\"notificationPreview\" [paymentReference]=\"refundlist?.payment_reference\"\n [payment]=\"paymentObj\"\n [contactDetails]=\"addressDetails\"\n [refundReason]=\"refundlist?.reason_code\"\n [refundAmount]=\"refundlist?.amount\"\n [refundReference]=\"refundlist?.refund_reference\">\n </app-notification-preview>\n\n\n\n <div class=\"govuk-button-group\">\n <button (click)=\"gotoEditDetailsPage(addressDetails, 'refundEditView')\" class=\"govuk-button govuk-button--secondary\"> Previous</button>\n <button (click)=\"submitEditDetail()\" class=\"govuk-button button\"\n data-module=\"govuk-button\">\n Send notification\n </button>\n </div>\n <p>\n <a (click)=\"loadRefundListPage()\" class=\"govuk-link\" data-module=\"govuk-button\">\n Cancel\n </a>\n </p>\n\n</ng-container>\n\n\n<ng-container *ngIf=\"viewName === 'confirmSubmitResetRefund'\">\n\n\n <div class=\"govuk-warning-text\">\n <h1 class=\"govuk-heading-l\">Reset Refund</h1>\n </div>\n\n <table class=\"govuk-table\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell\">When you click Submit, the system will:</td>\n </tr>\n\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell\">\n <div class=\"refund-list\">\n <ul class=\"govuk-list--bullet\">\n <li>Close current refund reference number {{ refundlist?.refund_reference }}</li>\n <li>Reissue refund with a new reference number</li>\n <li>Issue a new Offer and Contact notification for the reissued refund</li>\n </ul>\n </div>\n </td>\n </tr>\n </table>\n\n\n <button (click)=\"redirectToRefundListPage()\" class=\"govuk-button govuk-button--secondary\">Cancel</button>\n <button (click)=\"postResetRefund()\" class=\"govuk-button\">Submit</button>\n</ng-container>\n", styles: [".right{float:right!important}.button{margin-bottom:3em;font-size:19px}.cancelbtn{font-size:19px;font-weight:400}.btnmargin{margin-bottom:2em}.govuk-button--secondary{background-color:#dee0e2;box-shadow:0 2px #858688;color:#0b0c0c;margin-right:.5em}.govuk-warning-text__text,.govuk-label--s,.refund__symbol{font-size:19px;font-weight:400}.inline-error-class{outline:3px solid #a71414;outline-offset:0}.inline-error-message{color:#a71414;font-weight:700;margin-top:10px;font-size:20px}.govuk-button,.govuk-link{margin-right:1em;font-size:19px;font-weight:200}.govuk-button-group{padding-top:2em}.heading-medium{margin-top:.875em}.heading-large{margin-top:.25em}.govuk-panel--confirmation{color:#fff;background:#00703c}.govuk-heading-l{font-size:36px;margin-top:40px;margin-bottom:5px}.govuk-heading-m{font-size:24px}.govuk-panel__title{font-size:5rem}.govuk-panel_refund_title{margin-top:0;margin-bottom:30px;color:#fff;font-family:nta,Arial,sans-serif;-webkit-font-smoothing:antialiased;font-weight:700;font-size:48px}.govuk-body-m,.govuk-body{font-size:2.1875rem}.govuk-input--width-10{max-width:36ex}.col-14{width:14%!important}.col-10{width:10%!important}.col-11{width:11%!important}.col-18{width:18%!important}.col-21{width:21%!important}.col-9{width:9%!important}.col-40{width:40%!important}.col-15{width:15%!important}.col-16{width:16%!important}.col-25{width:25%!important}.col-24{width:24%!important}.govuk-error-summary__title{font-size:24px!important}.govuk-error-summary__body{font-size:19px!important}.font-size-19px{font-size:19px}.white{color:#fff}.pagesize{margin:2em;width:97%}.govuk-link{cursor:pointer}.contactDetails-width{width:70%}.whitespace-inherit{white-space:inherit!important}.hmcts-currency-input__symbol{font-family:nta,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px;line-height:initial;position:absolute;font-weight:200;padding:8px 10px;height:40px;box-sizing:border-box;background-color:#dee0e2;border:2px solid #0b0c0c}.refund-status-history-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1em}.govuk-button--secondary{margin-bottom:0}.govuk-heading-custom{padding-left:19em;padding-top:2em}.refund-list{text-align:left}.refund-list ul{list-style-type:disc;padding-left:2em}.govuk-button-group-custom{padding-top:3em;padding-left:20em;align-items:center;align-content:center}\n"], dependencies: [{ kind: "ngmodule", type: i0.forwardRef(() => CommonModule) }, { kind: "directive", type: i0.forwardRef(() => i3.NgForOf), selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i0.forwardRef(() => i3.NgIf), selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: i0.forwardRef(() => ReactiveFormsModule) }, { kind: "component", type: i0.forwardRef(() => NotificationPreviewComponent), selector: "app-notification-preview", inputs: ["payment", "contactDetails", "refundReason", "refundAmount", "paymentReference", "refundReference", "previewJourney", "notificationSent"], outputs: ["notificationPreviewEvent"] }, { kind: "component", type: i0.forwardRef(() => ContactDetailsComponent), selector: "ccpay-contact-details", inputs: ["isEditOperation", "isEditOperationInRefundList", "addressObj"], outputs: ["assignContactDetails", "assignContactDetailsInFefundsList", "redirectToIssueRefund"] }, { kind: "component", type: i0.forwardRef(() => AddRemissionComponent), selector: "ccpay-add-remission", inputs: ["fee", "fees", "payment", "remission", "ccdCaseNumber", "caseType", "viewCompStatus", "paymentGroupRef", "isTurnOff", "isRefundRemission", "isStrategicFixEnable", "paidAmount", "isFromRefundListPage", "isFromPaymentDetailPage", "isFromServiceRequestPage", "isFullyRefund", "feeamount", "refundPaymentReference", "isFromRefundStatusPage", "changeRefundReason", "isServiceRequest", "LOGGEDINUSERROLES", "orderDetail", "orderRef", "orderStatus", "orderParty", "orderCreated", "orderCCDEvent", "takepayment", "orderFeesTotal", "orderTotalPayments", "orderRemissionTotal"], outputs: ["cancelRemission", "refundListReason", "refundListAmount", "refundFees"] }, { kind: "pipe", type: i0.forwardRef(() => i3.DecimalPipe), name: "number" }, { kind: "pipe", type: i0.forwardRef(() => i3.CurrencyPipe), name: "currency" }, { kind: "pipe", type: i0.forwardRef(() => i3.DatePipe), name: "date" }, { kind: "pipe", type: i0.forwardRef(() => CcdHyphensPipe), name: "ccdHyphens" }] });
2038
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: RefundStatusComponent, deps: [{ token: i1$1.FormBuilder }, { token: RefundsService }, { token: NotificationService }, { token: 'PAYMENT_LIB' }, { token: OrderslistService }, { token: PaymentViewService }], target: i0.ɵɵFactoryTarget.Component });
2039
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: RefundStatusComponent, isStandalone: true, selector: "ccpay-refund-status", inputs: { LOGGEDINUSERROLES: "LOGGEDINUSERROLES", API_ROOT: "API_ROOT", ccdCaseNumber: "ccdCaseNumber", isTurnOff: "isTurnOff", orderParty: "orderParty" }, ngImport: i0, template: "\n<div *ngIf=\"errorMessage\">\n <div class=\"error-summary\" role=\"group\" aria-labelledby=\"failure-error-summary-heading\" tabindex=\"-1\">\n <h2 class=\"heading-medium error-summary-heading\" id=\"failure-error-summary-heading\">\n Error in processing the request\n </h2>\n <div class=\"govuk-error-summary__body\">\n {{ errorMessage }}\n </div>\n </div>\n</div>\n\n<ng-container *ngIf=\"viewName==='refundstatuslist' && rejectedRefundList && !isResendOperationSuccess && !isEditDetailsClicked\">\n <!-- payments -->\n\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header col-16\" scope=\"col\">Status</td>\n <td class=\"govuk-table__header col-11\" scope=\"col\">Amount</td>\n <td class=\"govuk-table__header col-18\" scope=\"col\">Date</td>\n <td class=\"govuk-table__header col-25\" scope=\"col\">Refund reference</td>\n <td class=\"govuk-table__header col-24 \" scope=\"col\">Reason</td>\n <td class=\"govuk-table__header\" scope=\"col\"></td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\" *ngIf=\"rejectedRefundList?.length > 0\">\n <tr class=\"govuk-table__row\" *ngFor=\"let refundList of rejectedRefundList\">\n <td class=\"govuk-table__cell whitespace-inherit\">{{ refundList?.refund_status['name'] }}</td>\n <td class=\"channel govuk-table__cell whitespace-inherit\">\u00A3{{ refundList?.amount | number:'.2' }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ refundList?.date_updated | date:'dd MMM yyyy'}}\n </td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ refundList?.refund_reference }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\"> {{refundList?.reason}}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">\n <a href=\"javascript:void(0)\" (click)=\"goToRefundView(refundList,'casetransactions')\">Review</a>\n </td>\n </tr>\n </tbody>\n <tbody class=\"govuk-table__body\" *ngIf=\"rejectedRefundList?.length === 0\">\n <td class=\"govuk-table__cell\" colspan=\"6\">No refunds recorded</td>\n </tbody>\n </table>\n</ng-container>\n\n<ng-container *ngIf=\"viewName==='refundview' && !isResendOperationSuccess && !isEditDetailsClicked\">\n <div class=\"govuk-breadcrumbs\">\n <ol class=\"govuk-breadcrumbs__list\">\n <li class=\"govuk-breadcrumbs__list-item\">\n <a href=\"javascript:void(0)\" (click)=\"loadRefundListPage()\" class=\"govuk-back-link govuk-label\">Back</a>\n </li>\n </ol>\n </div>\n <h2 class=\"govuk-heading-l\">Refund details</h2>\n <table>\n\n <tbody>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">Refund reference</td>\n <td>{{ refundlist?.refund_reference }}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">Payment to be refunded</td>\n <td>{{refundlist?.payment_reference }}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">Reason for refund</td>\n <td>{{ refundlist?.reason }}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">Amount refunded</td>\n <td>\u00A3{{refundlist?.amount | number:'.2' }}</td>\n </tr>\n\n </tbody>\n </table>\n\n\n <!-- Notification sent details -->\n <div>\n <br />\n <h2 class=\"govuk-heading-m\">Notifications sent</h2>\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header col-24 whitespace-inherit\" scope=\"col\">Date and time</td>\n <td class=\"govuk-table__header col-27 whitespace-inherit\" scope=\"col\">Sent to</td>\n <td class=\"govuk-table__header whitespace-inherit\" scope=\"col\">Sent via</td>\n <td class=\"govuk-table__header whitespace-inherit\" scope=\"col\">Actions</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\" *ngIf=\"notificationList\">\n <ng-container *ngFor=\"let notification of notificationList; let i = index;\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell whitespace-inherit\">{{notification.date_created | date:'dd MMMM yyyy HH:mm:ss'}}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{orderParty}}</td>\n <td class=\"govuk-table__cell whitespace-inherit col-40\">\n <div *ngIf=\"notification?.notification_type === 'EMAIL'\">\n <strong>Email</strong><br>\n {{notification?.contact_details?.email?.trim()}}\n </div>\n <div *ngIf=\"notification?.notification_type === 'LETTER'\">\n <strong>Post</strong><br>\n {{notification?.contact_details?.address_line?.trim()}} {{notification?.contact_details?.city?.trim()}} {{notification?.contact_details?.county?.trim()}} {{notification?.contact_details?.country?.trim()}} {{notification?.contact_details?.postal_code?.trim()}}\n </div>\n </td>\n\n <td class=\"govuk-table__cell whitespace-inherit\" *ngIf=\"i === 0\">\n\n <a *ngIf=\"isCurrentRefundInProcess()\" href=\"Javascript:void(0);\" (click)=\"putResend(notification)\">Resend</a><span *ngIf=\"isCurrentRefundInProcess()\">&nbsp;|&nbsp;</span>\n <a *ngIf=\"isCurrentRefundInProcess()\"href=\"Javascript:void(0);\" (click)=\"gotoEditAddressDetails(notification)\">Edit details</a><span *ngIf=\"isCurrentRefundInProcess()\">&nbsp;|&nbsp;</span>\n <a *ngIf=\"!notificationSentView || i != notificationSentViewIndex\" href=\"Javascript:void(0);\" (click)=\"showNotificationSentView(i)\">View</a>\n <a *ngIf=\"i === notificationSentViewIndex && notificationSentView\" href=\"Javascript:void(0);\" (click)=\"hideNotificationSentView()\">Hide</a>\n\n </td>\n\n <td class=\"govuk-table__cell whitespace-inherit\" *ngIf=\"i > 0\"><a *ngIf=\"!notificationSentView || i != notificationSentViewIndex\" href=\"Javascript:void(0);\" (click)=\"showNotificationSentView(i)\">View</a><a *ngIf=\"i === notificationSentViewIndex && notificationSentView\" href=\"Javascript:void(0);\" (click)=\"hideNotificationSentView()\">Hide</a></td>\n </tr>\n <tr *ngIf=\"i === notificationSentViewIndex && notificationSentView\">\n <td class=\"govuk-table__cell\" colspan=\"4\">\n <app-notification-preview\n [previewJourney]=\"'Notifications sent'\" [notificationSent]=\"notification?.sent_notification\">\n </app-notification-preview>\n </td>\n </tr>\n </ng-container>\n\n </tbody>\n <tbody class=\"govuk-table__body\" *ngIf=\"!notificationList\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell whitespace-inherit\" colspan=\"4\">No record found ... </td>\n </tr>\n </tbody>\n </table>\n </div>\n <!-- Status history -->\n <div>\n <br />\n <div class=\"refund-status-history-header govuk-flex\">\n <h2 class=\"govuk-heading-m\">Refund status history</h2>\n <div *ngIf=\"isCurrentRefundVisibleForReset()\">\n <button\n type=\"button\"\n [disabled]=\"isRefundStatusResetBtnDisabled\"\n class=\"govuk-button govuk-button--secondary\"\n (click)=\"displayResetRefundConfirmation()\">\n Reset Refund\n </button>\n </div>\n </div>\n <div *ngIf=\"refundStatusHistories\">\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header col-24 whitespace-inherit\" scope=\"col\">Status</td>\n <td class=\"govuk-table__header col-27 whitespace-inherit\" scope=\"col\">Date and time</td>\n <td class=\"govuk-table__header whitespace-inherit\" scope=\"col\">Users</td>\n <td class=\"govuk-table__header whitespace-inherit\" scope=\"col\">Notes</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\" *ngFor=\"let refundStatusHistory of refundStatusHistories;\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell whitespace-inherit\">{{refundStatusHistory.status}}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">\n {{refundStatusHistory.date_created | date:'dd MMMM yyyy HH:mm:ss'}}\n </td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{refundStatusHistory.created_by}}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{refundStatusHistory.notes}}</td>\n </tr>\n </tbody>\n </table>\n </div>\n\n </div>\n\n <ng-container *ngIf=\"viewName==='refundview' && !isFromPayBubble && !isResendOperationSuccess && !isEditDetailsClicked\">\n <div *ngIf=\"refundButtonState==='Update required'\" >\n <!-- <div *ngIf=\"refundButtonState==='sent back'\"> -->\n <br />\n <button type=\"submit\" class=\"button govuk-button--secondary btnmargin\"\n (click)=\"gotoReviewAndReSubmitPage()\">Change refund details</button>\n </div>\n <div *ngIf=\"isProcessRefund && !isLastUpdatedByCurrentUser && refundButtonState==='Sent for approval'\" >\n <!-- <div *ngIf=\"isProcessRefund && !isLastUpdatedByCurrentUser && refundButtonState==='sent for approval'\"> -->\n <br />\n <button type=\"submit\" class=\"button govuk-button--secondary\"\n (click)=\"goToRefundProcessComponent(refundlist.refund_reference,refundlist)\">Process refund</button>\n </div>\n </ng-container>\n\n\n</ng-container>\n\n<ng-container *ngIf=\"viewName==='reviewandsubmitview' && !isResendOperationSuccess && !isEditDetailsClicked\">\n <!-- <div class=\"govuk-breadcrumbs\">\n <ol class=\"govuk-breadcrumbs__list\">\n <li class=\"govuk-breadcrumbs__list-item\">\n <a (click)=\"gotoReviewDetailsPage($event)\" class=\"govuk-back-link govuk-label\">Back</a>\n </li>\n </ol>\n </div> -->\n <div class=\"govuk-warning-text\">\n <h1 class=\"heading-large\">Check your answers</h1>\n </div>\n <table class=\"govuk-table\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">Payment reference</td>\n <td class=\"govuk-table__cell\">{{ refundlist?.payment_reference}} </td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">Reason for return</td>\n <td class=\"govuk-table__cell\">{{refundreason}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">Refund reference</td>\n <td class=\"govuk-table__cell\">{{ refundlist?.refund_reference}} </td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">Reason for refund</td>\n <td class=\"govuk-table__cell\">{{ refundlist?.reason?.trim()}}\n <a (click)=\"gotoRefundReasonPage(refundlist?.reason)\" *ngIf=\"refundlist?.reason !== 'Retrospective remission' && refundlist?.reason !== 'Overpayment'\"\n class=\"govuk-link right\">Change</a>\n </td>\n\n <!-- <td class=\"govuk-table__cell\">{{ refundlist?.reason }}</td>\n <a (click)=\"gotoRefundReasonPage()\" class=\"govuk-link right\">Change</a> -->\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">Refund amount</td>\n <td class=\"govuk-table__cell\">\u00A3{{ changedAmount ? changedAmount : refundlist?.amount | number:'.2' }}\n <a (click)=\"gotoAmountPage()\" *ngIf=\"refundlist?.reason !== 'Overpayment'\"\n class=\"govuk-link right\">Change</a>\n </td>\n\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">Send to</td>\n <td class=\"govuk-table__cell\">{{orderParty}} </td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">Send via</td>\n <td class=\"govuk-table__cell whitespace-inherit\">\n <div *ngIf=\"refundlist?.contact_details?.notification_type === 'EMAIL'\" class=\"contactDetails-width font-size-19px\">\n <strong>Email</strong>\n <br/>\n {{refundlist?.contact_details?.email?.trim()}}\n </div>\n <div *ngIf=\"refundlist?.contact_details?.notification_type === 'LETTER'\" class=\"contactDetails-width font-size-19px\">\n <strong>Post</strong>\n <br/>\n {{refundlist?.contact_details?.address_line?.trim()}} {{refundlist?.contact_details?.city?.trim()}} {{refundlist?.contact_details?.county?.trim()}} {{refundlist?.contact_details?.country?.trim()}} {{refundlist?.contact_details?.postal_code?.trim()}}\n </div>\n <a class=\"govuk-link\" href=\"Javascript:void(0)\" *ngIf=\"refundlist?.contact_details !=null\" class=\"govuk-link right\" (click)=\"gotoEditDetailsPage(refundlist?.contact_details, 'reviewandsubmitEditview')\">\n Change\n </a>\n </td>\n </tr>\n\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">Notification</td>\n <td class=\"govuk-table__cell\">{{templateInstructionType}}\n <a *ngIf=\"!notificationPreview\" href=\"Javascript:void(0)\" class=\"govuk-link right\" (click)=\"showNotificationPreview()\">\n Preview\n </a>\n <a *ngIf=\"notificationPreview\" href=\"Javascript:void(0)\" class=\"govuk-link right\" (click)=\"hideNotificationPreview()\">\n Hide Preview\n </a>\n </td>\n </tr>\n </table>\n <app-notification-preview *ngIf=\"notificationPreview\"\n [paymentReference]=\"refundlist?.payment_reference\"\n [payment]=\"paymentObj\"\n [contactDetails]=\"refundlist?.contact_details\"\n [refundReason]=\"refundlist?.reason_code\"\n [refundAmount]=\"changedAmount ? changedAmount : refundlist?.amount\"\n [refundReference]=\"refundlist?.refund_reference\"></app-notification-preview>\n\n <div class=\"govuk-button-group\">\n <button (click)=\"gotoReviewDetailsPage($event)\" class=\"govuk-button govuk-button--secondary\"> Previous</button>\n <button [disabled]=\"isRefundBtnDisabled\" (click)=\"gotoReviewRefundConfirmationPage()\" class=\"govuk-button button\"\n data-module=\"govuk-button\">\n Submit refund\n </button>\n</div>\n<p><a href=\"javascript:void(0)\" (click)=\"loadRefundListPage()\" class=\"govuk-link\" data-module=\"govuk-button\">Cancel</a></p>\n <!-- <div class=\"govuk-button-group\">\n <button [disabled]=\"isRefundBtnDisabled\" (click)=\"gotoReviewRefundConfirmationPage()\" class=\"govuk-button button\"\n data-module=\"govuk-button\">\n Submit refund\n </button>\n </div> -->\n <!-- <p>\n <a (click)=\"loadRefundListPage()\" href=\"\" class=\"cancelbtn\">Cancel</a>\n </p> -->\n</ng-container>\n\n<ng-container *ngIf=\"viewName === 'reviewandsubmitEditview' && isEditDetailsClicked\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='EDITDETAILSPAGE'>\n <h1 class=\"govuk-heading-l\">Edit contact details</h1>\n <h2 class=\"govuk-heading-m govuk-font19px\">Case reference: {{ccdCaseNumber | ccdHyphens }}</h2>\n <span class=\"govuk-hint font-size-19px\">\n Refund reference: {{ refundlist?.refund_reference}}\n </span>\n <ccpay-contact-details\n [isEditOperationInRefundList] = isEditDetailsClicked\n [addressObj] = notification\n (assignContactDetailsInFefundsList)=\"getContactDetailsForRefundList($event)\"\n (redirectToIssueRefund)=\"gotoRefundReviewAndSubmitViewPageCancelBtnClicked($event)\" ></ccpay-contact-details>\n <p>\n <a (click)=\"loadRefundListPage()\" class=\"govuk-link\" data-module=\"govuk-button\">\n Cancel\n </a>\n </p>\n\n</ng-container>\n\n<ng-container *ngIf=\"viewName === 'issuerefundpage1' && !isResendOperationSuccess && !isEditDetailsClicked\">\n <ccpay-add-remission [isFromRefundListPage]=\"true\" [viewCompStatus]=\"viewName\" [isRefundRemission]=\"true\" [isFromRefundStatusPage] = \"true\"\n [changeRefundReason]= \"changeRefundReason\" [ccdCaseNumber]=\"ccdCaseNumber\" (refundListReason)=\"getRefundListReason($event)\" [refundPaymentReference]= \"refundlist?.payment_reference\" ></ccpay-add-remission>\n</ng-container>\n\n<ng-container *ngIf=\"viewName === 'processretroremissonpage' && !isResendOperationSuccess && !isEditDetailsClicked\">\n <ccpay-add-remission [isFromRefundListPage]=\"true\" [viewCompStatus]=\"viewName\" [isRefundRemission]=\"true\"\n [ccdCaseNumber]=\"ccdCaseNumber\" [refundPaymentReference]= \"refundlist?.payment_reference\" (refundListAmount)=\"getRefundAmount($event)\"></ccpay-add-remission>\n</ng-container>\n\n<ng-container *ngIf=\"viewName === 'issuerefund' && !isResendOperationSuccess && !isEditDetailsClicked\">\n <ccpay-add-remission [isFromRefundListPage]=\"true\" [viewCompStatus]=\"viewName\" [isRefundRemission]=\"true\" [isFromServiceRequestPage] = \"true\"\n [ccdCaseNumber]=\"ccdCaseNumber\" [refundPaymentReference]= \"refundlist?.payment_reference\" [isFromRefundStatusPage]=\"true\" (refundListAmount)=\"getRefundAmount($event)\" (refundFees)=\"getRefundFees($event)\"></ccpay-add-remission>\n</ng-container>\n\n<ng-container *ngIf=\"viewName === 'reviewrefundconfirmationpage' && !isResendOperationSuccess && !isEditDetailsClicked\">\n <div class=\"govuk-grid-row pagesize\">\n <div>\n <div class=\"govuk-panel govuk-panel--confirmation\">\n <h1 class=\"govuk-panel_refund_title\">\n Refund submitted\n </h1>\n\n <div class=\"govuk-panel__body\">\n <p class=\"govuk-body white\"><strong class=\"white\">Refund reference:{{refundReference}} </strong></p>\n </div>\n\n </div>\n\n <h2 class=\"govuk-heading-l\">What happens next</h2>\n <p class=\"govuk-body\">\n A refund request for {{refundAmount| currency:'GBP':'symbol-narrow':'1.2-2'}} has been created and will be passed to a team leader to approve.\n </p>\n\n <p class=\"govuk-body\">\n <a href=\"javascript:void(0)\" (click)=\"loadRefundListPage()\" class=\"govuk-link\">Return to case</a>\n </p>\n </div>\n </div>\n</ng-container>\n\n<ng-container *ngIf=\"isResendOperationSuccess\">\n <div class=\"govuk-grid-row pagesize\">\n <div>\n <div class=\"govuk-panel govuk-panel--confirmation\">\n <h1 class=\"govuk-panel_refund_title\">\n Notification sent\n </h1>\n\n <div class=\"govuk-panel__body\">\n <p class=\"govuk-body white\"><strong class=\"white\">Refund reference: {{ refundlist?.refund_reference}} </strong></p>\n </div>\n\n </div>\n <p class=\"govuk-body\">\n <a href=\"javascript:void(0)\" (click)=\"loadRefundListPage()\" class=\"govuk-link\">Return to case</a>\n </p>\n </div>\n </div>\n</ng-container>\n<ng-container *ngIf=\"viewName === 'refundEditView' && isEditDetailsClicked\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='EDITDETAILSPAGE'>\n <h1 class=\"govuk-heading-l\">Edit contact details</h1>\n <h2 class=\"govuk-heading-m govuk-font19px\">Case reference: {{ccdCaseNumber | ccdHyphens }}</h2>\n <span class=\"govuk-hint font-size-19px\">\n Refund reference: {{ refundlist?.refund_reference}}\n </span>\n <ccpay-contact-details\n [isEditOperationInRefundList] = isEditDetailsClicked\n [addressObj] = notification\n (assignContactDetailsInFefundsList)=\"getContactDetails($event)\"\n (redirectToIssueRefund)=\"gotoRefundViewPageCancelBtnClicked($event)\" ></ccpay-contact-details>\n <p>\n <a (click)=\"loadRefundListPage()\" class=\"govuk-link\" data-module=\"govuk-button\">\n Cancel\n </a>\n </p>\n\n</ng-container>\n<ng-container *ngIf=\"viewName === 'revieweditdetailsconfirmationpage' && !isResendOperationSuccess && isEditDetailsClicked\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='EDITDETAILSCHECKANDANSWERPAGE'>\n <h1 class=\"govuk-heading-l\">Check your answers</h1>\n <dl class=\"govuk-summary-list\">\n <div class=\"govuk-summary-list__row font-size-19px\">\n <dt class=\"govuk-summary-list__key\">\n Refund reference\n </dt>\n <dd class=\"govuk-summary-list__value\">\n {{ refundlist?.refund_reference}}\n </dd>\n <span class=\"govuk-summary-list__actions\"></span>\n </div>\n <div class=\"govuk-summary-list__row font-size-19px\">\n <dt class=\"govuk-summary-list__key\">\n Send via\n <br/>\n </dt>\n <dd class=\"govuk-summary-list__value\">\n <div *ngIf=\"addressDetails?.notification_type === 'EMAIL'\" class=\"contactDetails-width font-size-19px\">\n <strong>Email</strong>\n <br/>\n {{addressDetails?.email?.trim()}}\n </div>\n <div *ngIf=\"addressDetails?.notification_type === 'LETTER'\" class=\"contactDetails-width font-size-19px\">\n <strong>Post</strong>\n <br/>\n {{addressDetails?.address_line?.trim()}} {{addressDetails?.city?.trim()}} {{addressDetails?.county?.trim()}} {{addressDetails?.country?.trim()}} {{addressDetails?.postal_code?.trim()}}\n </div>\n </dd>\n <dd class=\"govuk-summary-list__actions\">\n <a class=\"govuk-link\" href=\"Javascript:void(0)\" (click)=\"gotoEditDetailsPage(addressDetails, 'refundEditView')\">\n Change\n </a>\n </dd>\n </div>\n <div class=\"govuk-summary-list__row font-size-19px\">\n <dt class=\"govuk-summary-list__key\">\n Notification\n </dt>\n <dd class=\"govuk-summary-list__value\">\n {{templateInstructionType}}\n </dd>\n <span class=\"govuk-summary-list__actions\">\n <a *ngIf=\"!notificationPreview\" href=\"Javascript:void(0)\" class=\"govuk-link right\" (click)=\"showNotificationPreview()\">\n Preview\n </a>\n <a *ngIf=\"notificationPreview\" href=\"Javascript:void(0)\" class=\"govuk-link right\" (click)=\"hideNotificationPreview()\">\n Hide Preview\n </a>\n </span>\n </div>\n </dl>\n\n <app-notification-preview *ngIf=\"notificationPreview\" [paymentReference]=\"refundlist?.payment_reference\"\n [payment]=\"paymentObj\"\n [contactDetails]=\"addressDetails\"\n [refundReason]=\"refundlist?.reason_code\"\n [refundAmount]=\"refundlist?.amount\"\n [refundReference]=\"refundlist?.refund_reference\">\n </app-notification-preview>\n\n\n\n <div class=\"govuk-button-group\">\n <button (click)=\"gotoEditDetailsPage(addressDetails, 'refundEditView')\" class=\"govuk-button govuk-button--secondary\"> Previous</button>\n <button (click)=\"submitEditDetail()\" class=\"govuk-button button\"\n data-module=\"govuk-button\">\n Send notification\n </button>\n </div>\n <p>\n <a (click)=\"loadRefundListPage()\" class=\"govuk-link\" data-module=\"govuk-button\">\n Cancel\n </a>\n </p>\n\n</ng-container>\n\n\n<ng-container *ngIf=\"viewName === 'confirmSubmitResetRefund'\">\n\n\n <div class=\"govuk-warning-text\">\n <h1 class=\"govuk-heading-l\">Reset Refund</h1>\n </div>\n\n <table class=\"govuk-table\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell\">When you click Submit, the system will:</td>\n </tr>\n\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell\">\n <div class=\"refund-list\">\n <ul class=\"govuk-list--bullet\">\n <li>Close current refund reference number {{ refundlist?.refund_reference }}</li>\n <li>Reissue refund with a new reference number</li>\n <li>Issue a new Offer and Contact notification for the reissued refund</li>\n </ul>\n </div>\n </td>\n </tr>\n </table>\n\n\n <button (click)=\"redirectToRefundListPage()\" class=\"govuk-button govuk-button--secondary\">Cancel</button>\n <button (click)=\"postResetRefund()\" class=\"govuk-button\">Submit</button>\n</ng-container>\n", styles: [".right{float:right!important}.button{margin-bottom:3em;font-size:19px}.cancelbtn{font-size:19px;font-weight:400}.btnmargin{margin-bottom:2em}.govuk-button--secondary{background-color:#dee0e2;box-shadow:0 2px #858688;color:#0b0c0c;margin-right:.5em}.govuk-warning-text__text,.govuk-label--s,.refund__symbol{font-size:19px;font-weight:400}.inline-error-class{outline:3px solid #a71414;outline-offset:0}.inline-error-message{color:#a71414;font-weight:700;margin-top:10px;font-size:20px}.govuk-button,.govuk-link{margin-right:1em;font-size:19px;font-weight:200}.govuk-button-group{padding-top:2em}.heading-medium{margin-top:.875em}.heading-large{margin-top:.25em}.govuk-panel--confirmation{color:#fff;background:#00703c}.govuk-heading-l{font-size:36px;margin-top:40px;margin-bottom:5px}.govuk-heading-m{font-size:24px}.govuk-panel__title{font-size:5rem}.govuk-panel_refund_title{margin-top:0;margin-bottom:30px;color:#fff;font-family:nta,Arial,sans-serif;-webkit-font-smoothing:antialiased;font-weight:700;font-size:48px}.govuk-body-m,.govuk-body{font-size:2.1875rem}.govuk-input--width-10{max-width:36ex}.col-14{width:14%!important}.col-10{width:10%!important}.col-11{width:11%!important}.col-18{width:18%!important}.col-21{width:21%!important}.col-9{width:9%!important}.col-40{width:40%!important}.col-15{width:15%!important}.col-16{width:16%!important}.col-25{width:25%!important}.col-24{width:24%!important}.govuk-error-summary__title{font-size:24px!important}.govuk-error-summary__body{font-size:19px!important}.font-size-19px{font-size:19px}.white{color:#fff}.pagesize{margin:2em;width:97%}.govuk-link{cursor:pointer}.contactDetails-width{width:70%}.whitespace-inherit{white-space:inherit!important}.hmcts-currency-input__symbol{font-family:nta,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px;line-height:initial;position:absolute;font-weight:200;padding:8px 10px;height:40px;box-sizing:border-box;background-color:#dee0e2;border:2px solid #0b0c0c}.refund-status-history-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1em}.govuk-button--secondary{margin-bottom:0}.govuk-heading-custom{padding-left:19em;padding-top:2em}.refund-list{text-align:left}.refund-list ul{list-style-type:disc;padding-left:2em}.govuk-button-group-custom{padding-top:3em;padding-left:20em;align-items:center;align-content:center}\n"], dependencies: [{ kind: "ngmodule", type: i0.forwardRef(() => CommonModule) }, { kind: "directive", type: i0.forwardRef(() => i3.NgForOf), selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i0.forwardRef(() => i3.NgIf), selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: i0.forwardRef(() => ReactiveFormsModule) }, { kind: "component", type: i0.forwardRef(() => NotificationPreviewComponent), selector: "app-notification-preview", inputs: ["payment", "contactDetails", "refundReason", "refundAmount", "paymentReference", "refundReference", "previewJourney", "notificationSent"], outputs: ["notificationPreviewEvent"] }, { kind: "component", type: i0.forwardRef(() => ContactDetailsComponent), selector: "ccpay-contact-details", inputs: ["isEditOperation", "isEditOperationInRefundList", "addressObj"], outputs: ["assignContactDetails", "assignContactDetailsInFefundsList", "redirectToIssueRefund"] }, { kind: "component", type: i0.forwardRef(() => AddRemissionComponent), selector: "ccpay-add-remission", inputs: ["fee", "fees", "payment", "remission", "ccdCaseNumber", "caseType", "viewCompStatus", "paymentGroupRef", "isTurnOff", "isRefundRemission", "isStrategicFixEnable", "paidAmount", "isFromRefundListPage", "isFromPaymentDetailPage", "isFromServiceRequestPage", "isFullyRefund", "feeamount", "refundPaymentReference", "isFromRefundStatusPage", "changeRefundReason", "isServiceRequest", "LOGGEDINUSERROLES", "orderDetail", "orderRef", "orderStatus", "orderParty", "orderCreated", "orderCCDEvent", "takepayment", "orderFeesTotal", "orderTotalPayments", "orderRemissionTotal"], outputs: ["cancelRemission", "refundListReason", "refundListAmount", "refundFees"] }, { kind: "pipe", type: i0.forwardRef(() => i3.DecimalPipe), name: "number" }, { kind: "pipe", type: i0.forwardRef(() => i3.CurrencyPipe), name: "currency" }, { kind: "pipe", type: i0.forwardRef(() => i3.DatePipe), name: "date" }, { kind: "pipe", type: i0.forwardRef(() => CcdHyphensPipe), name: "ccdHyphens" }] });
2038
2040
  }
2039
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: RefundStatusComponent, decorators: [{
2041
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: RefundStatusComponent, decorators: [{
2040
2042
  type: Component,
2041
2043
  args: [{ selector: 'ccpay-refund-status', imports: [
2042
2044
  CommonModule,
@@ -2317,25 +2319,25 @@ class CaseTransactionsComponent {
2317
2319
  this.resetOrderVariables();
2318
2320
  if (paymentGroup.fees) {
2319
2321
  paymentGroup.fees.forEach(fee => {
2320
- this.orderFeesTotal = this.orderFeesTotal + fee.calculated_amount;
2321
- this.overPaymentAmount = this.overPaymentAmount + fee.over_payment;
2322
+ this.orderFeesTotal = this.addCurrency(this.orderFeesTotal, fee.calculated_amount);
2323
+ this.overPaymentAmount = this.addCurrency(this.overPaymentAmount, fee.over_payment);
2322
2324
  this.paymentLibComponent.overPaymentAmount = this.overPaymentAmount;
2323
2325
  });
2324
2326
  }
2325
2327
  if (paymentGroup.remissions) {
2326
2328
  paymentGroup.remissions.forEach(remission => {
2327
- this.orderRemissionTotal = this.orderRemissionTotal + remission.hwf_amount;
2329
+ this.orderRemissionTotal = this.addCurrency(this.orderRemissionTotal, remission.hwf_amount);
2328
2330
  });
2329
2331
  }
2330
2332
  if (paymentGroup.payments) {
2331
2333
  const isFeeOverPaymentExist = this.overPaymentAmount === 0;
2332
2334
  paymentGroup.payments.forEach(payment => {
2333
2335
  if (isFeeOverPaymentExist) {
2334
- this.overPaymentAmount = this.overPaymentAmount + payment.over_payment;
2336
+ this.overPaymentAmount = this.addCurrency(this.overPaymentAmount, payment.over_payment);
2335
2337
  this.paymentLibComponent.overPaymentAmount = this.overPaymentAmount;
2336
2338
  }
2337
2339
  if (payment.status.toUpperCase() === 'SUCCESS') {
2338
- this.orderTotalPayments = this.orderTotalPayments + payment.amount;
2340
+ this.orderTotalPayments = this.addCurrency(this.orderTotalPayments, payment.amount);
2339
2341
  }
2340
2342
  });
2341
2343
  }
@@ -2395,18 +2397,18 @@ class CaseTransactionsComponent {
2395
2397
  this.orderDetail.forEach(orderDetail => {
2396
2398
  if (orderDetail.fees) {
2397
2399
  orderDetail.fees.forEach(fee => {
2398
- this.orderFeesTotal = this.orderFeesTotal + fee.calculated_amount;
2400
+ this.orderFeesTotal = this.addCurrency(this.orderFeesTotal, fee.calculated_amount);
2399
2401
  });
2400
2402
  }
2401
2403
  if (orderDetail.remissions) {
2402
2404
  orderDetail.remissions.forEach(remission => {
2403
- this.orderRemissionTotal = this.orderRemissionTotal + remission.hwf_amount;
2405
+ this.orderRemissionTotal = this.addCurrency(this.orderRemissionTotal, remission.hwf_amount);
2404
2406
  });
2405
2407
  if (orderDetail.payments) {
2406
2408
  this.payment = orderDetail.payments[0];
2407
2409
  orderDetail.payments.forEach(payment => {
2408
2410
  if (payment.status.toUpperCase() === 'SUCCESS') {
2409
- this.orderTotalPayments = this.orderTotalPayments + payment.amount;
2411
+ this.orderTotalPayments = this.addCurrency(this.orderTotalPayments, payment.amount);
2410
2412
  }
2411
2413
  });
2412
2414
  }
@@ -2452,13 +2454,13 @@ class CaseTransactionsComponent {
2452
2454
  if (fee.date_created) {
2453
2455
  let a = fee.amount_due === undefined;
2454
2456
  let b = fee.amount_due <= 0;
2455
- this.clAmountDue = a ? this.clAmountDue + fee.net_amount : b ? this.clAmountDue + 0 : this.clAmountDue + fee.amount_due;
2457
+ this.clAmountDue = a ? this.addCurrency(this.clAmountDue, fee.net_amount) : b ? this.clAmountDue : this.addCurrency(this.clAmountDue, fee.amount_due);
2456
2458
  }
2457
2459
  fee['payment_group_reference'] = paymentGroup['payment_group_reference'];
2458
2460
  this.fees.push(fee);
2459
2461
  }
2460
2462
  else {
2461
- feesTotal = feesTotal + fee.calculated_amount;
2463
+ feesTotal = this.addCurrency(feesTotal, fee.calculated_amount);
2462
2464
  this.fees.push(fee);
2463
2465
  }
2464
2466
  });
@@ -2472,9 +2474,9 @@ class CaseTransactionsComponent {
2472
2474
  if (!this.isTurnOff) {
2473
2475
  let allocationLen = payment.payment_allocation;
2474
2476
  if (payment.status.toUpperCase() === 'SUCCESS') {
2475
- paymentsTotal = paymentsTotal + payment.amount;
2477
+ paymentsTotal = this.addCurrency(paymentsTotal, payment.amount);
2476
2478
  if (allocationLen.length === 0 || allocationLen.length > 0 && allocationLen[0].allocation_status === 'Allocated') {
2477
- nonOffLinePayment = nonOffLinePayment + payment.amount;
2479
+ nonOffLinePayment = this.addCurrency(nonOffLinePayment, payment.amount);
2478
2480
  }
2479
2481
  if (allocationLen.length > 0) {
2480
2482
  this.nonPayments.push(payment);
@@ -2488,7 +2490,7 @@ class CaseTransactionsComponent {
2488
2490
  }
2489
2491
  else {
2490
2492
  if (payment.status.toUpperCase() === 'SUCCESS') {
2491
- paymentsTotal = paymentsTotal + payment.amount;
2493
+ paymentsTotal = this.addCurrency(paymentsTotal, payment.amount);
2492
2494
  this.payments.push(payment);
2493
2495
  }
2494
2496
  payment.paymentGroupReference = paymentGroup.payment_group_reference;
@@ -2503,13 +2505,13 @@ class CaseTransactionsComponent {
2503
2505
  }
2504
2506
  if (paymentGroup.fees) {
2505
2507
  paymentGroup.fees.forEach(fee => {
2506
- feesTotal = feesTotal + fee.calculated_amount;
2508
+ feesTotal = this.addCurrency(feesTotal, fee.calculated_amount);
2507
2509
  this.fees.push(fee);
2508
2510
  });
2509
2511
  }
2510
2512
  if (paymentGroup.remissions) {
2511
2513
  paymentGroup.remissions.forEach(remisison => {
2512
- remissionsTotal = remissionsTotal + remisison.hwf_amount;
2514
+ remissionsTotal = this.addCurrency(remissionsTotal, remisison.hwf_amount);
2513
2515
  this.remissions.push(remisison);
2514
2516
  });
2515
2517
  }
@@ -2592,7 +2594,7 @@ class CaseTransactionsComponent {
2592
2594
  if (paymentGroup.fees) {
2593
2595
  // this.isFeeRecordsExist = true;
2594
2596
  paymentGroup.fees.forEach(fee => {
2595
- feesTotal = feesTotal + fee.calculated_amount;
2597
+ feesTotal = this.addCurrency(feesTotal, fee.calculated_amount);
2596
2598
  this.isRemissionsMatch = false;
2597
2599
  if (paymentGroup.remissions) {
2598
2600
  paymentGroup.remissions.forEach(rem => {
@@ -2622,13 +2624,13 @@ class CaseTransactionsComponent {
2622
2624
  if (paymentGroup.payments) {
2623
2625
  paymentGroup.payments.forEach(payment => {
2624
2626
  if (payment.status.toUpperCase() === 'SUCCESS') {
2625
- paymentsTotal = paymentsTotal + payment.amount;
2627
+ paymentsTotal = this.addCurrency(paymentsTotal, payment.amount);
2626
2628
  }
2627
2629
  });
2628
2630
  }
2629
2631
  if (paymentGroup.remissions) {
2630
2632
  paymentGroup.remissions.forEach(remission => {
2631
- remissionsTotal = remissionsTotal + remission.hwf_amount;
2633
+ remissionsTotal = this.addCurrency(remissionsTotal, remission.hwf_amount);
2632
2634
  });
2633
2635
  }
2634
2636
  grpOutstandingAmount = (feesTotal - remissionsTotal) - paymentsTotal;
@@ -2652,7 +2654,7 @@ class CaseTransactionsComponent {
2652
2654
  if (paymentGroup.fees) {
2653
2655
  this.isFeeRecordsExist = true;
2654
2656
  paymentGroup.fees.forEach(fee => {
2655
- feesTotal = feesTotal + fee.calculated_amount;
2657
+ feesTotal = this.addCurrency(feesTotal, fee.calculated_amount);
2656
2658
  if (fee.calculated_amount === 0) {
2657
2659
  isFeeAmountZero = true;
2658
2660
  }
@@ -2661,13 +2663,13 @@ class CaseTransactionsComponent {
2661
2663
  if (paymentGroup.payments) {
2662
2664
  paymentGroup.payments.forEach(payment => {
2663
2665
  if (payment.status.toUpperCase() === 'SUCCESS') {
2664
- paymentsTotal = paymentsTotal + payment.amount;
2666
+ paymentsTotal = this.addCurrency(paymentsTotal, payment.amount);
2665
2667
  }
2666
2668
  });
2667
2669
  }
2668
2670
  if (paymentGroup.remissions) {
2669
2671
  paymentGroup.remissions.forEach(remission => {
2670
- remissionsTotal = remissionsTotal + remission.hwf_amount;
2672
+ remissionsTotal = this.addCurrency(remissionsTotal, remission.hwf_amount);
2671
2673
  });
2672
2674
  }
2673
2675
  grpOutstandingAmount = (feesTotal - remissionsTotal) - paymentsTotal;
@@ -2676,14 +2678,14 @@ class CaseTransactionsComponent {
2676
2678
  totalRefundAmount = grpOutstandingAmount;
2677
2679
  }
2678
2680
  else {
2679
- totalRefundAmount = (totalRefundAmount + grpOutstandingAmount);
2681
+ totalRefundAmount = this.addCurrency(totalRefundAmount, grpOutstandingAmount);
2680
2682
  }
2681
2683
  }
2682
2684
  else if (grpOutstandingAmount > 0 || (grpOutstandingAmount === 0 && isFeeAmountZero)) {
2683
2685
  this.isGrpOutstandingAmtPositive = true;
2684
2686
  }
2685
2687
  });
2686
- return totalRefundAmount * -1;
2688
+ return Number((totalRefundAmount * -1).toFixed(2));
2687
2689
  }
2688
2690
  }
2689
2691
  getGroupOutstandingAmount(paymentGroup) {
@@ -2909,10 +2911,16 @@ class CaseTransactionsComponent {
2909
2911
  setPaymentGroupReference(paymentGroupRef) {
2910
2912
  this.paymentLibComponent.paymentGroupReference = paymentGroupRef;
2911
2913
  }
2912
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: CaseTransactionsComponent, deps: [{ token: i1$2.Router }, { token: PaymentViewService }, { token: BulkScaningPaymentService }, { token: CaseTransactionsService }, { token: 'PAYMENT_LIB' }, { token: OrderslistService }], target: i0.ɵɵFactoryTarget.Component });
2913
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.1", type: CaseTransactionsComponent, isStandalone: true, selector: "ccpay-case-transactions", inputs: { LOGGEDINUSERROLES: "LOGGEDINUSERROLES", isTakePayment: "isTakePayment", isFromServiceRequestPage: "isFromServiceRequestPage" }, ngImport: i0, template: "<div>\n <main>\n <ng-container *ngIf=\"viewStatus === 'main1'\">\n <div *ngIf=\"viewStatus === 'main1'&& !isTurnOff && takePayment\">\n <div *ngIf=\"takePayment\" class=\"govuk-grid-row\">\n\n <div class=\"govuk-grid-column-two-thirds\">\n <h1 class=\"govuk-heading-xl\">Case transactions</h1>\n </div>\n </div>\n\n <div *ngIf=\"takePayment\" class=\"govuk-grid-row\">\n <div *ngIf='!isExceptionRecord' class=\"govuk-grid-column-two-thirds govuk-!-padding-bottom-6 govuk-!-padding-top-6\">\n <h3 class=\"heading-medium\">CCD reference:</h3>\n <span> {{ ccdCaseNumber | ccdHyphens }}</span>\n </div>\n\n <div *ngIf='isExceptionRecord' class=\"govuk-grid-column-two-thirds govuk-!-padding-bottom-6 govuk-!-padding-top-6\">\n <h3 class=\"heading-medium\">Exception reference:</h3>\n <span> {{ ccdCaseNumber | ccdHyphens }}</span>\n </div>\n <div class=\"govuk-grid-column-full govuk-!-padding-bottom-3\">\n <hr class=\"govuk-section-break govuk-section-break--visible\">\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\">Total payments</td>\n <td class=\"govuk-table__header\" scope=\"col\">Total remissions</td>\n <td class=\"govuk-table__header\" scope=\"col\">Amount due</td>\n <td class=\"govuk-table__header govuk-table__header--custom\" scope=\"col\" *ngIf=\"isBulkScanEnable\">Unallocated payments</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\">\n <tr class=\"totalpayments govuk-table__row\">\n <td class=\"govuk-table__cell summary-table-font\">{{ totalPayments | currency :'GBP':'symbol':'1.2-2' }}</td>\n <td class=\"govuk-table__cell summary-table-font\">{{ totalRemissions | currency :'GBP':'symbol':'1.2-2' }}</td>\n <td class=\"govuk-table__cell summary-table-font\">{{ clAmountDue | currency :'GBP':'symbol':'1.2-2'}}</td>\n <td class=\"govuk-table__cell case-transaction__color summary-table-font\" *ngIf=\"isBulkScanEnable\">{{unprocessedRecordCount}}</td>\n </tr>\n </tbody>\n </table>\n </div>\n\n <div class=\"govuk-grid-column-two-thirds\" *ngIf=\"takePayment\">\n <button type=\"submit\" (click)=\"redirectToFeeSearchPage($event)\"\n [disabled]=\"!isAddFeeBtnEnabled\"\n [ngClass]='!isAddFeeBtnEnabled ? \"govuk-button govuk-button--secondary govuk-button--disabled govuk-!-margin-right-1\" : \"govuk-button govuk-button--secondary govuk-!-margin-right-1\"'>\n Take telephony payment\n </button>\n </div>\n\n </div>\n <div class=\"govuk-grid-row\">\n\n </div>\n <div *ngIf=\"takePayment\" class=\" govuk-!-margin-top-9\">\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-full\">\n <h3 class=\"heading-medium\">Fees</h3>\n </div>\n <div class=\"govuk-grid-column-full\">\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\">Code</td>\n <td class=\"govuk-table__header\" scope=\"col\">Description</td>\n <td class=\"govuk-table__header\" scope=\"col\">Volume</td>\n <td class=\"govuk-table__header\" scope=\"col\">Fee amount</td>\n <td class=\"govuk-table__header\" scope=\"col\">Calculated amount</td>\n <td class=\"govuk-table__header\" scope=\"col\">Amount due</td>\n <td class=\"govuk-table__header\" scope=\"col\">Action</td>\n\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\" *ngFor=\"let paymentGroup of paymentGroups;\">\n <tr class=\"govuk-table__row\" *ngFor=\"let fee of paymentGroup.fees; let i = index;\">\n <td class=\"govuk-table__cell\">\t{{fee.code}} </td>\n <td class=\"govuk-table__cell\">{{fee.description}}</td>\n <td class=\"govuk-table__cell\">{{fee.volume? fee.volume : '-'}}</td>\n <td class=\"govuk-table__cell\">{{ fee.net_amount | currency:'GBP':'symbol-narrow':'1.2-2' }}</td>\n <td class=\"govuk-table__cell\">{{fee.calculated_amount | currency:'GBP':'symbol-narrow':'1.2-2' }}</td>\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\" [attr.rowspan]=\"paymentGroup.fees.length\" *ngIf=\"paymentGroup.old && i==0\"> {{getGroupOutstandingAmount(paymentGroup)| currency:'GBP':'symbol-narrow':'1.2-2'}}* </td>\n <td class=\"govuk-table__cell\" *ngIf=\"!paymentGroup.old\"> {{calculateAmountDue(fee) | currency:'GBP':'symbol-narrow':'1.2-2'}} </td>\n <td class=\"govuk-table__cell\" *ngIf=\"!paymentGroup.old\">\n <a (click)=\"confirmRemoveFee(fee.id)\" [ngClass]='!isCheckAmountdueExist(fee.amount_due) || fee.remissions ? \"disable-link\" : \"\"'>Remove</a>\n </td>\n <td class=\"govuk-table__cell\" *ngIf=\"paymentGroup.old\">\n <a (click)=\"confirmRemoveFee(fee.id)\" [ngClass]='paymentGroup.payments?.length > 0 || paymentGroup.remissions?.length > 0 ? \"disable-link\" : \"\"'>Remove</a>\n </td>\n </tr>\n </tbody>\n <tbody class=\"govuk-table__body\" *ngIf=\"paymentGroups?.length === 0\">\n <tr class=\"govuk-table__row\" >\n <td class=\"govuk-table__cell\" colspan=\"7\">No fees recorded</td>\n </tr>\n </tbody>\n </table>\n </div>\n </div>\n <div class=\"hmcts-banner\" *ngIf=\"isHistoricGroupAvailable\">\n <svg class=\"hmcts-banner__icon\" fill=\"currentColor\" role=\"presentation\" focusable=\"false\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 25 25\" height=\"25\" width=\"25\">\n <path d=\"M13.7,18.5h-2.4v-2.4h2.4V18.5z M12.5,13.7c-0.7,0-1.2-0.5-1.2-1.2V7.7c0-0.7,0.5-1.2,1.2-1.2s1.2,0.5,1.2,1.2v4.8\n C13.7,13.2,13.2,13.7,12.5,13.7z M12.5,0.5c-6.6,0-12,5.4-12,12s5.4,12,12,12s12-5.4,12-12S19.1,0.5,12.5,0.5z\"></path>\n </svg>\n <div class=\"hmcts-banner__message\">\n <span class=\"hmcts-banner__assistive\">information</span>\n * These fees have already been processed offline. Check the notes in CCD for more information.\n </div>\n </div>\n <div class=\"panel panel-no--style\" *ngIf=\"allPayments?.length > 0 || remissions?.length > 0\">\n <!-- payments -->\n <h3 class=\"heading-medium\">Payments</h3>\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header col-28\" scope=\"col\">Payment reference</td>\n <td class=\"govuk-table__header\" scope=\"col\">Date created</td>\n <td class=\"govuk-table__header\" scope=\"col\">Channel</td>\n <td class=\"govuk-table__header\" scope=\"col\">Method</td>\n <td class=\"govuk-table__header col-15\" scope=\"col\">Amount</td>\n <td class=\"govuk-table__header\" scope=\"col\">Allocation status</td>\n <td class=\"govuk-table__header\" scope=\"col\">Payment status</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\" *ngIf=\"allPayments?.length > 0\">\n <tr class=\"govuk-table__row\" *ngFor=\"let payment of allPayments\">\n <td class=\"govuk-table__cell whitespace-inherit\">\n <a href=\"javascript:void(0)\" (click)=\"goToPayementView(payment.paymentGroupReference, payment.reference, payment.method)\">{{ payment.reference }}</a>\n </td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ payment.date_created | date:'dd MMM yyyy' }}</td>\n <td class=\"channel govuk-table__cell whitespace-inherit\">{{ payment.channel | lowercase }}</td>\n <td class=\"govuk-table__cell capitalize whitespace-inherit\">{{ payment.method | lowercase}}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ payment.amount | currency:'GBP':'symbol-narrow':'1.2-2' }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\"> {{getAllocationStatus(payment)}}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ payment.status }}</td>\n </tr>\n </tbody>\n <tbody class=\"govuk-table__body\" *ngIf=\"allPayments?.length === 0\">\n <td class=\"govuk-table__cell\" colspan=\"7\">No payments recorded</td>\n </tbody>\n </table>\n\n <!-- remissions -->\n <h3 class=\"heading-medium\">Remissions</h3>\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\">Remission reference</td>\n <td class=\"govuk-table__header\" scope=\"col\">Date created</td>\n <td class=\"govuk-table__header\" scope=\"col\">Remission code</td>\n <td class=\"govuk-table__header\" scope=\"col\">Fee code</td>\n <td class=\"govuk-table__header\" scope=\"col\">Remission amount</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\" *ngIf=\"remissions?.length > 0\">\n <tr class=\"govuk-table__row\" *ngFor=\"let remission of remissions\">\n <td class=\"govuk-table__cell whitespace-inherit\">{{ remission.remission_reference }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ remission.date_created | date:'dd MMM yyyy' }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ remission.hwf_reference }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ remission.fee_code }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ remission.hwf_amount | currency:'GBP':'symbol-narrow':'1.2-2'}}</td>\n </tr>\n </tbody>\n <tbody class=\"govuk-table__body\" *ngIf=\"remissions?.length === 0\">\n <td class=\"govuk-table__cell\" colspan=\"5\">No remissions recorded</td>\n </tbody>\n </table>\n </div>\n </div>\n </div>\n\n <div *ngIf=\"takePayment && isTurnOff\">\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n <h1 class=\"govuk-heading-xl\">Case transactions</h1>\n </div>\n\n <div class=\"govuk-grid-column-one-third\" align=\"right\" >\n <a [ngClass]=\"{ 'disable': !isAddFeeBtnEnabled} \" (click)=\"redirectToFeeSearchPage($event)\" class=\"button\">Add a new fee</a>\n </div>\n </div>\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds govuk-!-padding-bottom-6\">\n <h3 class=\"heading-medium\">CCD reference:</h3>\n <span> {{ ccdCaseNumber | ccdHyphens }}</span>\n </div>\n\n <div class=\"govuk-grid-column-full govuk-!-padding-bottom-3\">\n <hr class=\"govuk-section-break govuk-section-break--visible\">\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\">Total payments</td>\n <td class=\"govuk-table__header\" scope=\"col\">Total remissions</td>\n <td class=\"govuk-table__header\" scope=\"col\">Amount due</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\">\n <tr class=\"totalpayments govuk-table__row\">\n <td class=\"govuk-table__cell\">{{ totalPayments | currency :'GBP':'symbol':'1.2-2' }}</td>\n <td class=\"govuk-table__cell\">{{ totalRemissions | currency :'GBP':'symbol':'1.2-2' }}</td>\n <td class=\"govuk-table__cell\">{{ (totalFees - totalRemissions) - totalPayments | currency :'GBP':'symbol':'1.2-2'}}</td>\n </tr>\n </tbody>\n </table>\n </div>\n </div>\n\n\n <!-- No fees start -->\n <div *ngIf=\"paymentGroups?.length === 0\">\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-full\">\n <span class=\"heading-small\">Existing fees</span>\n </div>\n\n <div class=\"govuk-grid-column-full\">\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\">Code</td>\n <td class=\"govuk-table__header\" scope=\"col\">Description</td>\n <td class=\"govuk-table__header\" scope=\"col\">Volume</td>\n <td class=\"govuk-table__header\" scope=\"col\">Fee amount</td>\n <td class=\"govuk-table__header\" scope=\"col\">Calculated amount</td>\n <td class=\"govuk-table__header\" scope=\"col\">Group amount outstanding</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell\" colspan=\"6\">No fees recorded</td>\n </tr>\n </tbody>\n </table>\n </div>\n </div>\n </div>\n\n <!-- No fees end -->\n\n <div *ngFor=\"let paymentGroup of paymentGroups\">\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-full govuk-grid-column-full--gr\">\n <span class=\"heading-medium\">Group reference: {{paymentGroup.payment_group_reference}}</span>\n </div>\n </div>\n <div class=\"govuk-grid-row\">\n\n <!--New Code start-->\n\n <div class=\"govuk-grid-column-full\">\n <span class=\"heading-small\">Exisiting fees</span>\n </div>\n <div class=feeclass>\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\">Code</td>\n <td class=\"govuk-table__header\" scope=\"col\">Description</td>\n <td class=\"govuk-table__header\" scope=\"col\">Volume</td>\n <td class=\"govuk-table__header\" scope=\"col\">Fee amount</td>\n <td class=\"govuk-table__header\" scope=\"col\">Calculated amount</td>\n <td class=\"groupamount govuk-table__header\" scope=\"col\">Group amount outstanding</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\" >\n <tr class=\"govuk-table__row\" *ngFor=\"let fee of paymentGroup.fees; let i = index;\">\n <td class=\"govuk-table__cell govuk-table__cell--col1\">{{fee.code}}</td>\n <td class=\"govuk-table__cell govuk-table__cell--col2\"> {{fee.description}} </td>\n <td class=\"govuk-table__cell govuk-table__cell--col3 align-center\"> {{fee.volume? fee.volume : '-'}} </td>\n <td class=\"govuk-table__cell govuk-table__cell--col4\"> {{ fee.net_amount | currency:'GBP':'symbol-narrow':'1.2-2' }} </td>\n <td class=\"govuk-table__cell govuk-table__cell--col5\"> {{fee.calculated_amount | currency:'GBP':'symbol-narrow':'1.2-2' }} </td>\n <td class=\"govuk-table__cell govuk-table__cell--col6 govuk-table__custom--col6\" [attr.rowspan]=\"paymentGroup.fees.length\" *ngIf=\"i==0\">\n {{getGroupOutstandingAmount(paymentGroup) | currency:'GBP':'symbol-narrow':'1.2-2' }} </td>\n </tr>\n </tbody>\n <tbody class=\"govuk-table__body\" *ngIf=\"paymentGroup.fees.length==0\">\n <td class=\"govuk-table__cell\" colspan=\"6\">No payments recorded</td>\n </tbody>\n </table>\n </div>\n </div>\n <div class=\"govuk-inset-text govuk-inset-text__no-border\" *ngIf=\"paymentGroup.payments || paymentGroup.remissions\">\n <details>\n <summary class=\"govuk-hidetext\">\n <span class=\"summary\">Allocated payments and remissions</span>\n </summary>\n\n <div class=\"panel panel-border-narrow\">\n <!-- payments -->\n <span class=\"heading-medium\">Payments</span>\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\">Payment reference</td>\n <td class=\"govuk-table__header\" scope=\"col\">Date created</td>\n <td class=\"govuk-table__header\" scope=\"col\">Channel</td>\n <td class=\"govuk-table__header\" scope=\"col\">Method</td>\n <td class=\"govuk-table__header\" scope=\"col\">Amount</td>\n <td class=\"govuk-table__header\" scope=\"col\">Allocation status</td>\n <td class=\"govuk-table__header\" scope=\"col\">Status</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\" *ngIf=\"paymentGroup.payments?.length > 0\">\n <tr class=\"govuk-table__row\" *ngFor=\"let payment of paymentGroup.payments\">\n <td class=\"govuk-table__cell whitespace-inherit\">\n <a href=\"javascript:void(0)\" (click)=\"goToPayementView(paymentGroup.payment_group_reference, payment.reference, payment.method)\">{{ payment.reference }}</a>\n </td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ payment.date_created | date:'dd MMM yyyy' }}</td>\n <td class=\"channel govuk-table__cell whitespace-inherit\">{{ payment.channel | lowercase }}</td>\n <td class=\"govuk-table__cell capitalize whitespace-inherit\">{{ payment.method | lowercase}}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ payment.amount }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\"> {{getAllocationStatus(payment)}}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ payment.status }}</td>\n </tr>\n </tbody>\n <tbody class=\"govuk-table__body\" *ngIf=\"paymentGroup.payments?.length === 0\">\n <td class=\"govuk-table__cell\" colspan=\"6\">No payments recorded</td>\n </tbody>\n </table>\n\n <!-- remissions -->\n <span class=\"heading-medium\">Remissions</span>\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\">Remission reference</td>\n <td class=\"govuk-table__header\" scope=\"col\">Date created</td>\n <td class=\"govuk-table__header\" scope=\"col\">Remission code</td>\n <td class=\"govuk-table__header\" scope=\"col\">Fee applied against</td>\n <td class=\"govuk-table__header\" scope=\"col\">Remission amount</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\" *ngIf=\"paymentGroup.remissions?.length > 0\">\n <tr class=\"govuk-table__row\" *ngFor=\"let remission of paymentGroup.remissions\">\n <td class=\"govuk-table__cell whitespace-inherit\">{{ remission.remission_reference }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ remission.date_created | date:'dd MMM' }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ remission.hwf_reference }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ remission.fee_code }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ remission.hwf_amount }}</td>\n </tr>\n </tbody>\n <tbody class=\"govuk-table__body\" *ngIf=\"paymentGroup.remissions?.length === 0\">\n <td class=\"govuk-table__cell\" colspan=\"5\">No remissions recorded</td>\n </tbody>\n </table>\n </div>\n </details>\n\n\n <div *ngIf=\"takePayment\">\n <button type=\"submit\" (click)=\"loadFeeSummaryPage(paymentGroup)\"\n [disabled]=\"(getGroupOutstandingAmount(paymentGroup) <= 0 || isUnprocessedRecordSelected)\"\n [ngClass]='(getGroupOutstandingAmount(paymentGroup) <= 0 || isUnprocessedRecordSelected) ? \"govuk-button govuk-button--secondary govuk-button--disabled govuk-!-margin-right-1\" : \"govuk-button govuk-button--secondary govuk-!-margin-right-1\"'>\n Add telephone payment\n </button>\n </div>\n </div>\n </div>\n <ccpay-app-unprocessed-payments\n *ngIf=\"isBulkScanEnable\"\n [IS_BUTTON_ENABLE]=\"takePayment\"\n [LEVEL]=\"5\"\n [PAYMENTSLENGTH]=\"allPayments?.length\"\n [PAYMENTREF]=\"paymentRef\"\n [ISTURNOFF]=\"isTurnOff\"\n [ISSFENABLE]=\"isStrategicFixEnable\"\n [FEE_RECORDS_EXISTS]=\"isFeeRecordsExist\"\n (getUnprocessedFeeCount) = \"getUnprocessedFeeCount($event)\"\n [IS_OS_AMT_AVAILABLE]=\"isGrpOutstandingAmtPositive\"\n [CCD_CASE_NUMBER]=\"ccdCaseNumber\"\n [SELECTED_OPTION]=\"selectedOption\"\n [DCN_NUMBER]=\"dcnNumber\"\n [ISBSENABLE]=\"isBulkScanEnable\"\n [CASETYPE]=\"caseType\"\n (selectedUnprocessedFeeEvent) = \"selectedUnprocessedFeeEvent($event)\"\n (setBspaymentdcn) = \"setBspaymentdcn($event)\"\n (setViewName) = \"setViewName($event)\"\n (setUnProcessedPaymentServiceId) = \"setUnProcessedPaymentServiceId($event)\"\n (setPaymentGroupReference) = \"setPaymentGroupReference($event)\">\n </ccpay-app-unprocessed-payments>\n <div class=\"govuk-grid-row govuk-grid__surplus-payments\" *ngIf=\"totalRefundAmount > 0 && takePayment\">\n <div class=\"govuk-grid-column-full govuk-grid__surplus-payments-col1\">\n <h3 class=\"heading-medium\">Surplus payments</h3>\n </div>\n <div class=\"govuk-grid-column-full\">\n Total surplus payments received: {{totalRefundAmount | currency :'GBP':'symbol':'1.2-2'}}\n </div>\n </div>\n </div>\n\n <div *ngIf=\"takePayment\">\n <ccpay-app-unprocessed-payments\n *ngIf=\"isBulkScanEnable && !takePayment\"\n [IS_BUTTON_ENABLE]=\"takePayment\"\n [LEVEL]=\"1\"\n [ISTURNOFF]=\"isTurnOff\"\n [ISSFENABLE]=\"isStrategicFixEnable\"\n [FEE_RECORDS_EXISTS]=\"isFeeRecordsExist\"\n [IS_OS_AMT_AVAILABLE]=\"isGrpOutstandingAmtPositive\"\n (getUnprocessedFeeCount) = \"getUnprocessedFeeCount($event)\"\n [PAYMENTSLENGTH]=\"allPayments?.length\"\n [PAYMENTREF]=\"paymentRef\"\n [CCD_CASE_NUMBER]=\"ccdCaseNumber\"\n [SELECTED_OPTION]=\"selectedOption\"\n [DCN_NUMBER]=\"dcnNumber\"\n [ISBSENABLE]=\"isBulkScanEnable\"\n [CASETYPE]=\"caseType\"\n (selectedUnprocessedFeeEvent) = \"selectedUnprocessedFeeEvent($event)\"\n (setBspaymentdcn) = \"setBspaymentdcn($event)\"\n (setViewName) = \"setViewName($event)\"\n (setUnProcessedPaymentServiceId) = \"setUnProcessedPaymentServiceId($event)\"\n (setPaymentGroupReference) = \"setPaymentGroupReference($event)\">\n </ccpay-app-unprocessed-payments>\n </div>\n\n <div *ngIf=\"!takePayment\" class=\"govuk-grid-row govuk-grid__surplus-payments\">\n\n <div class=\"govuk-grid-column-full\">\n\n <span class=\"heading-medium\">{{ \"Payments\" | rpxTranslate }}</span>\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header col-13\" scope=\"col\">{{ \"Status\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-10\" scope=\"col\">{{ \"Amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-14\" scope=\"col\">{{ \"Date allocated\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-20\" scope=\"col\">{{ \"Request reference\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-9\" scope=\"col\"></td>\n <td class=\"govuk-table__header\" scope=\"col\"></td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\" *ngIf=\"allPayments?.length > 0\">\n <tr class=\"govuk-table__row\" *ngFor=\"let payment of allPayments\">\n <td class=\"govuk-table__cell col-13 whitespace-inherit\">{{ payment.status | rpxTranslate }}</td>\n <td class=\"govuk-table__cell col-10 whitespace-inherit\">{{ payment.amount | currency :'GBP':'symbol':'1.2-2' }}</td>\n <td class=\"govuk-table__cell col-17 whitespace-inherit\">{{ payment.date_created | date:'dd MMM yyyy HH:mm:ss' }}</td>\n <td class=\"govuk-table__cell col-24 whitespace-inherit\">{{ payment.paymentGroupReference }}</td>\n <td class=\"govuk-table__cell col-13 whitespace-inherit\"></td>\n <td class=\"govuk-table__cell whitespace-inherit\">\n <a href=\"javascript:void(0)\" (click)=\"goToPayementView(payment.paymentGroupReference, payment.reference, payment.method)\">{{ \"Review\" | rpxTranslate }}</a>\n </td>\n </tr>\n </tbody>\n\n </table>\n <ccpay-app-unprocessed-payments class=\"govuk-table\"\n *ngIf=\"isBulkScanEnable && !takePayment\"\n [IS_BUTTON_ENABLE]=\"takePayment\"\n [LEVEL]=\"2\"\n [ISTURNOFF]=\"isTurnOff\"\n [ISSFENABLE]=\"isStrategicFixEnable\"\n [FEE_RECORDS_EXISTS]=\"isFeeRecordsExist\"\n [IS_OS_AMT_AVAILABLE]=\"isGrpOutstandingAmtPositive\"\n [PAYMENTSLENGTH]=\"allPayments?.length\"\n [PAYMENTREF]=\"paymentRef\"\n [CCD_CASE_NUMBER]=\"ccdCaseNumber\"\n [SELECTED_OPTION]=\"selectedOption\"\n [DCN_NUMBER]=\"dcnNumber\"\n [ISBSENABLE]=\"isBulkScanEnable\"\n [CASETYPE]=\"caseType\"\n (getUnprocessedFeeCount) = \"getUnprocessedFeeCount($event)\"\n (selectedUnprocessedFeeEvent) = \"selectedUnprocessedFeeEvent($event)\"\n (setBspaymentdcn) = \"setBspaymentdcn($event)\"\n (setViewName) = \"setViewName($event)\"\n (setUnProcessedPaymentServiceId) = \"setUnProcessedPaymentServiceId($event)\"\n (setPaymentGroupReference) = \"setPaymentGroupReference($event)\">\n </ccpay-app-unprocessed-payments>\n </div>\n </div>\n </ng-container>\n\n<!--Order Case Transactions Page-->\n <ng-container *ngIf=\"viewStatus === 'main' && !isTurnOff && takePayment\">\n <div>\n\n <div>\n <h1 class=\"govuk-grid-column-two-thirds govuk-heading-l govuk-!-margin-top-0\">Case transactions</h1>\n <ng-container *ngIf='!isExceptionRecord' class=\" govuk-!-margin-bottom-6 alignself\">\n <b> Case reference: </b>{{ ccdCaseNumber | ccdHyphens }}\n </ng-container>\n <ng-container *ngIf='isExceptionRecord' class=\"govuk-!-margin-bottom-3 col-55 alignself\" >\n <b> Exception reference:</b>{{ ccdCaseNumber | ccdHyphens }}\n </ng-container>\n <div>\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header col-25\" scope=\"col\">Total payments</td>\n <td class=\"govuk-table__header govuk-table__header--custom col-25\" scope=\"col\" *ngIf=\"isBulkScanEnable\">Unallocated payments</td>\n <td class=\"govuk-table__header col-25\" scope=\"col\">Total remissions</td>\n <td class=\"govuk-table__header col-20\" scope=\"col\">Amount due</td>\n <td class=\"govuk-table__header col-20\" scope=\"col\">Over payment</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\">\n <tr class=\"totalpayments govuk-table__row\">\n <td class=\"govuk-table__cell summary-table-font\">{{ totalPayments | currency :'GBP':'symbol':'1.2-2' }}</td>\n <td class=\"govuk-table__cell case-transaction__color summary-table-font\" *ngIf=\"isBulkScanEnable\">{{unprocessedRecordCount}}</td>\n\n <td class=\"govuk-table__cell summary-table-font\">{{ totalRemissions | currency :'GBP':'symbol':'1.2-2' }}</td>\n <td class=\"govuk-table__cell summary-table-font\">{{ clAmountDue | currency :'GBP':'symbol':'1.2-2'}}</td>\n <td class=\"govuk-table__cell summary-table-font\">{{ overPaymentAmount | currency :'GBP':'symbol':'1.2-2'}}</td>\n\n </tr>\n </tbody>\n </table>\n </div>\n </div>\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='ORDERIDDETAILS'>\n\n <!--Payment Request-->\n <div class=\"paymentrequest\">\n <span class=\"heading-medium\">{{ \"Service requests\" | rpxTranslate }}</span>\n <ng-container>\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header col-14\" scope=\"col\">{{ \"Status\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-10\" scope=\"col\">{{ \"Amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-18\" scope=\"col\">{{ \"Party\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-21\" scope=\"col\">{{ \"Request reference\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-9\" scope=\"col\"></td>\n <td class=\"govuk-table__header col\" scope=\"col\"></td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\" *ngIf=\"orderLevelFees?.length > 0\">\n <tr *ngFor=\"let orderRef of orderLevelFees;let i = index;\">\n <td class=\"govuk-table__cell whitespace-inherit\">{{ orderRef.orderStatus | rpxTranslate }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ orderRef.orderTotalFees | currency :'GBP':'symbol':'1.2-2' }}</td>\n <td *ngIf=\"cpoDetails !== null && cpoDetails.length !== 0\" class=\"govuk-table__cell whitespace-inherit\">\n <ng-container *ngFor=\"let cpo of cpoDetails\">\n <ng-container *ngIf=\"cpo.orderReference == orderRef.orderRefId\">\n {{cpo.responsibleParty}}\n </ng-container>\n </ng-container>\n </td>\n <td *ngIf=\"cpoDetails === null || cpoDetails.length === 0\" class=\"govuk-table__cell whitespace-inherit\"></td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{orderRef.orderRefId}}</td>\n <td class=\"govuk-table__cell\">\n <a href=\"javascript:void(0)\" (click)=\"goToOrderViewDetailSection(orderRef)\">{{ \"Review\" | rpxTranslate }}</a>\n </td>\n <td class=\"alignright\">\n\n <button type=\"submit\" (click)=\"redirectToOrderFeeSearchPage($event,orderRef)\"\n [disabled]=\"!orderRef.orderAddBtnEnable\"\n [ngClass]='!orderRef.orderAddBtnEnable ? \"govuk-button govuk-button--secondary govuk-button--disabled govuk-!-margin-right-1\" : \"govuk-button govuk-button--secondary govuk-!-margin-right-1\"'>\n {{ \"Take telephony payment\" | rpxTranslate }}\n </button></td>\n </tr>\n </tbody>\n <tbody class=\"govuk-table__body alignleft\" *ngIf=\"orderLevelFees?.length === 0\">\n <td colspan=\"6\">{{ \"No service requests on this case.\" | rpxTranslate }}</td>\n </tbody>\n </table>\n </ng-container>\n <!-- <ng-container *ngIf=\"orderLevelFees?.length === 0\">\n <br/>No service requests on this case.<br/>\n </ng-container> -->\n <span>\n <br/>\n <a (click)=\"redirectToFeeSearchPage($event)\"\n [class.disable-link]=\"!isAddFeeBtnEnabled\">{{ \"Create service request and pay\" | rpxTranslate }}</a><br/>\n </span>\n </div>\n <div>\n <span class=\"heading-medium\"><br/>{{ \"Payments\" | rpxTranslate }}</span>\n <ccpay-app-unprocessed-payments\n *ngIf=\"isBulkScanEnable\"\n [IS_BUTTON_ENABLE]=\"takePayment\"\n [LEVEL]=\"3\"\n [PAYMENTSLENGTH]=\"allPayments?.length\"\n [ISTURNOFF]=\"isTurnOff\"\n [ISSFENABLE]=\"isStrategicFixEnable\"\n [PAYMENTREF]=\"paymentRef\"\n [FEE_RECORDS_EXISTS]=\"isFeeRecordsExist\"\n (getUnprocessedFeeCount) = \"getUnprocessedFeeCount($event)\"\n [IS_OS_AMT_AVAILABLE]=\"isGrpOutstandingAmtPositive\"\n [CCD_CASE_NUMBER]=\"ccdCaseNumber\"\n [SELECTED_OPTION]=\"selectedOption\"\n [DCN_NUMBER]=\"dcnNumber\"\n [ISBSENABLE]=\"isBulkScanEnable\"\n [CASETYPE]=\"caseType\"\n (selectedUnprocessedFeeEvent) = \"selectedUnprocessedFeeEvent($event)\"\n (setBspaymentdcn) = \"setBspaymentdcn($event)\"\n (setViewName) = \"setViewName($event)\"\n (setUnProcessedPaymentServiceId) = \"setUnProcessedPaymentServiceId($event)\"\n (setPaymentGroupReference) = \"setPaymentGroupReference($event)\">\n </ccpay-app-unprocessed-payments>\n\n <ng-container>\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n </thead>\n <tbody class=\"govuk-table__body\" *ngIf=\"allPayments?.length > 0\">\n <tr class=\"govuk-table__row\" *ngFor=\"let payment of allPayments\">\n <td class=\"govuk-table__cell col-14 whitespace-inherit\">{{ payment.status | rpxTranslate }}</td>\n <td class=\"govuk-table__cell col-10 whitespace-inherit\">{{ payment.amount | currency :'GBP':'symbol':'1.2-2' }}</td>\n <td class=\"govuk-table__cell col-17 whitespace-inherit\">{{ payment.date_created | date:'dd MMM yyyy' }}</td>\n <td class=\"govuk-table__cell col-24 whitespace-inherit\">{{ payment.paymentGroupReference }}</td>\n <td class=\"govuk-table__cell col-13 whitespace-inherit\"></td>\n <td class=\"govuk-table__cell whitespace-inherit\">\n <a href=\"javascript:void(0)\" (click)=\"goToPayementView(payment.paymentGroupReference, payment.reference, payment.method)\">{{ \"Review\" | rpxTranslate }}</a>\n </td>\n </tr>\n </tbody>\n\n <tbody class=\"govuk-table__body\" *ngIf=\"allPayments?.length === 0 && unprocessedRecordCount <= 0\">\n <td colspan=\"6\">{{ \"No payments recorded\" | rpxTranslate }}</td>\n </tbody>\n </table>\n\n </ng-container>\n\n </div>\n <div *ngIf=\"!check4AllowedRoles2AccessPBApayment()\">\n <span class=\"heading-medium\"><br/>{{ \"Refunds\" | rpxTranslate }}</span>\n <ccpay-refund-status\n [ccdCaseNumber]=\"ccdCaseNumber\"\n [isTurnOff]=\"isTurnOff\"\n [orderParty]=\"orderParty\"\n [LOGGEDINUSERROLES]=\"LOGGEDINUSERROLES\"\n ></ccpay-refund-status>\n </div>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"!takePayment && viewStatus === 'main'\">\n <div class=\"govuk-grid-column-full\" [ngClass]='serviceRequestValue!== \"false\" ? \"govuk-margin-btm-20px\" : \"\"'>\n <!-- <span *ngIf=\"serviceRequestValue === 'false'\" class=\"heading-medium\">Service requests</span> -->\n <ng-container *ngIf=\"!(orderLevelFees?.length === 0 && !isAnyFeeGroupAvilable) && serviceRequestValue !== 'false' \">\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header col-14\" scope=\"col\">{{ \"Status\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-18\" scope=\"col\">{{ \"Amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-18\" scope=\"col\">{{ \"Party\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-24\" scope=\"col\">{{ \"Request reference\t\" | rpxTranslate }}\n </td>\n <td class=\"govuk-table__header col-9\" scope=\"col\"></td>\n <td class=\"govuk-table__header\" scope=\"col\"></td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\" *ngIf=\"orderLevelFees?.length > 0\">\n <tr class=\"govuk-table__row\" *ngFor=\"let orderRef of orderLevelFees;let i = index;\">\n <td class=\"govuk-table__cell whitespace-inherit\">{{ orderRef.orderStatus | rpxTranslate }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{orderRef.orderTotalFees | currency :'GBP':'symbol':'1.2-2'}}</td>\n <td *ngIf=\"cpoDetails !== null && cpoDetails.length !== 0\" class=\"govuk-table__cell whitespace-inherit\">\n <ng-container *ngFor=\"let cpo of cpoDetails\">\n <ng-container *ngIf=\"cpo.orderReference == orderRef.orderRefId\">\n {{cpo.responsibleParty}}\n </ng-container>\n </ng-container>\n </td>\n <td *ngIf=\"cpoDetails === null || cpoDetails.length === 0\" class=\"govuk-table__cell whitespace-inherit\"></td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{orderRef.orderRefId}}</td>\n <td class=\"govuk-table__cell of-visible\"> <a href=\"javascript:void(0)\" (click)=\"loadPBAAccountPage(orderRef)\" *ngIf=\"serviceRequestValue !== 'false' && check4AllowedRoles2AccessPBApayment() && orderRef.orderStatus === 'Not paid'\"> {{ \"Pay now\" | rpxTranslate }}</a></td>\n <td class=\"govuk-table__cell\">\n <a href=\"javascript:void(0)\" (click)=\"goToOrderViewDetailSection(orderRef)\">{{ \"Review\" | rpxTranslate }}</a>\n </td>\n </tr>\n </tbody>\n <tbody class=\"govuk-table__body\" *ngIf=\"orderLevelFees?.length === 0 && serviceRequestValue === 'false'\">\n <tr class=\"govuk-table__row\" >\n <td class=\"alignleft\" colspan=\"7\">{{ \"No service requests on this case.\" | rpxTranslate }}</td>\n </tr>\n </tbody>\n </table>\n </ng-container>\n <ng-container *ngIf=\"orderLevelFees?.length === 0 && serviceRequestValue !== 'false' && !isAnyFeeGroupAvilable\">\n <h1 class=\"govuk-heading-l govuk-heading-lw\">{{ \"If you are expecting to pay and are not able to see a service request,\" | rpxTranslate }}</h1>\n <p>{{ \"please refresh and try in some time.\" | rpxTranslate }}</p>\n </ng-container>\n <!-- </div> -->\n </div>\n <div class=\"govuk-grid-column-full\">\n <div *ngIf=\"serviceRequestValue === 'false'\">\n <span class=\"heading-medium\"><br/>{{ \"Payments\" | rpxTranslate }}</span>\n <ng-container >\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header col-14\" scope=\"col\">{{ \"Status\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-10\" scope=\"col\">{{ \"Amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-17\" scope=\"col\">{{ \"Date\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-24\" scope=\"col\">{{ \"Payment reference\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-13\" scope=\"col\"></td>\n <td class=\"govuk-table__header\" scope=\"col\"></td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\" *ngIf=\"allPayments?.length > 0\">\n <tr class=\"govuk-table__row\" *ngFor=\"let payment of allPayments\">\n <td class=\"govuk-table__cell whitespace-inherit\">{{ payment.status | rpxTranslate }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ payment.amount | currency :'GBP':'symbol':'1.2-2' }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ payment.date_created | date:'dd MMM yyyy' }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ payment?.reference }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\"></td>\n <td class=\"govuk-table__cell whitespace-inherit\">\n <a href=\"javascript:void(0)\" (click)=\"goToPayementView(payment.paymentGroupReference, payment.reference, payment.method)\">{{ \"Review\" | rpxTranslate }}</a>\n </td>\n </tr>\n </tbody>\n\n <tbody class=\"govuk-table__body\" *ngIf=\"allPayments?.length === 0\">\n <td colspan=\"6\">{{ \"No payments recorded\" | rpxTranslate }}</td>\n </tbody>\n </table>\n <ccpay-app-unprocessed-payments class=\"govuk-table\"\n *ngIf=\"isBulkScanEnable && !takePayment\"\n [IS_BUTTON_ENABLE]=\"takePayment\"\n [LEVEL]=\"4\"\n [ISTURNOFF]=\"isTurnOff\"\n [ISSFENABLE]=\"isStrategicFixEnable\"\n [PAYMENTSLENGTH]=\"allPayments?.length\"\n [PAYMENTREF]=\"paymentRef\"\n (getUnprocessedFeeCount) = \"getUnprocessedFeeCount($event)\"\n [FEE_RECORDS_EXISTS]=\"isAnyFeeGroupAvilable\"\n [IS_OS_AMT_AVAILABLE]=\"isGrpOutstandingAmtPositive\"\n [CCD_CASE_NUMBER]=\"ccdCaseNumber\"\n [SELECTED_OPTION]=\"selectedOption\"\n [DCN_NUMBER]=\"dcnNumber\"\n [ISBSENABLE]=\"isBulkScanEnable\"\n [CASETYPE]=\"caseType\"\n (selectedUnprocessedFeeEvent) = \"selectedUnprocessedFeeEvent($event)\"\n (setBspaymentdcn) = \"setBspaymentdcn($event)\"\n (setViewName) = \"setViewName($event)\"\n (setUnProcessedPaymentServiceId) = \"setUnProcessedPaymentServiceId($event)\"\n (setPaymentGroupReference) = \"setPaymentGroupReference($event)\">\n </ccpay-app-unprocessed-payments>\n </ng-container>\n\n </div>\n </div>\n <div class=\"govuk-grid-column-full\" *ngIf=\"!check4AllowedRoles2AccessPBApayment()\">\n <span class=\"heading-medium\"><br/>Refunds</span>\n <ccpay-refund-status\n [ccdCaseNumber]=\"ccdCaseNumber\"\n [orderParty] =\"orderParty\"\n [LOGGEDINUSERROLES]=\"LOGGEDINUSERROLES\"\n ></ccpay-refund-status>\n </div>\n\n </ng-container>\n\n\n<input #myInput type='hidden' class='iFrameDrivenImageValue' value='FEEREMOVALCONFIRMATION_2'>\n\n<!-- Order Full View Details-->\n<ng-container *ngIf=\"viewStatus === 'order-full-view'\">\n <ccpay-service-request\n [viewStatus] = \"viewStatus\"\n [orderRef] = \"orderRef\"\n [orderStatus] = \"orderStatus\"\n [orderCreated] = \"orderCreated\"\n [orderParty] = \"orderParty\"\n [orderCCDEvent] = \"orderCCDEvent\"\n [orderDetail] = \"orderDetail\"\n [paymentGroupList] = \"paymentGroups\"\n [LOGGEDINUSERROLES] = \"LOGGEDINUSERROLES\"\n [ccdCaseNumber] = \"ccdCaseNumber\"\n [orderFeesTotal] = \"orderFeesTotal\"\n [orderTotalPayments] = \"orderTotalPayments\"\n [orderRemissionTotal] = \"orderRemissionTotal\"\n [isServiceRequest] = \"serviceRequestValue\"\n (goToServiceRquestComponent) = \"goToServiceRequestPage()\"\n ></ccpay-service-request>\n\n</ng-container>\n<ccpay-add-remission *ngIf=\"viewStatus === 'addremission' && feeId\"\n[isTurnOff]=\"isTurnOff\"\n[isStrategicFixEnable]=\"isStrategicFixEnable\"\n[viewCompStatus]= \"viewStatus\"\n[fee]=\"feeId\"\n[orderStatus] =\"orderStatus\"\n[paidAmount]= \"orderTotalPayments\"\n[isRefundRemission]=\"isRefundRemission\"\n[caseType]=\"caseType\"\n[paymentGroupRef]=\"orderRef\"\n[isFromServiceRequestPage] = \"true\"\n[payment] = \"payment\"\n[ccdCaseNumber]=\"ccdCaseNumber\"></ccpay-add-remission>\n\n<ccpay-add-remission *ngIf=\"viewStatus === 'issuerefund' && payment\"\n[isTurnOff]=\"isTurnOff\"\n[isStrategicFixEnable]=\"isStrategicFixEnable\"\n[viewCompStatus]= \"viewStatus\"\n[isFromServiceRequestPage] = \"true\"\n[payment]=\"payment\"\n[orderStatus] =\"orderStatus\"\n[paidAmount]= \"orderTotalPayments\"\n[isRefundRemission]=\"isRefundRemission\"\n[caseType]=\"caseType\"\n[paymentGroupRef]=\"orderRef\"\n[ccdCaseNumber]=\"ccdCaseNumber\"></ccpay-add-remission>\n<ccpay-add-remission *ngIf=\"viewStatus === 'addrefundforremission' && payment\"\n[isTurnOff]=\"isTurnOff\"\n[isStrategicFixEnable]=\"isStrategicFixEnable\"\n[viewCompStatus]= \"viewStatus\"\n[payment]=\"payment\"\n[orderStatus] =\"orderStatus\"\n[paidAmount]= \"orderTotalPayments\"\n[isRefundRemission]=\"isRefundRemission\"\n[caseType]=\"caseType\"\n[feeamount]=\"remissionFeeAmt\"\n[remission] = \"remissions\"\n[isFromServiceRequestPage]=\"true\"\n[ccdCaseNumber]=\"ccdCaseNumber\"></ccpay-add-remission>\n\n<ng-container *ngIf=\"viewStatus === 'feeRemovalConfirmation'\">\n <div class=\"govuk-warning-text\">\n <span class=\"govuk-warning-text__icon\" aria-hidden=\"true\">!</span>\n <strong class=\"govuk-warning-text__text\">\n <span class=\"govuk-warning-text__assistive\">Warning</span>\n Are you sure you want to delete this fee?\n </strong>\n </div>\n <div class=\"govuk-button-grb\">\n <form novalidate>\n <button type=\"submit\" class=\"button govuk-button--secondary\" (click)=\"cancelRemoval()\">\n Cancel\n </button>\n <button type=\"submit\" class=\"button\"\n [disabled]=\"isRemoveBtnDisabled\"\n [ngClass]='isRemoveBtnDisabled ? \"button button--disabled govuk-!-margin-right-1\" : \"button govuk-!-margin-right-1\"'\n (click)=\"removeFee(feeId)\">\n Remove\n </button>\n </form>\n </div>\n</ng-container>\n</main>\n</div>\n<!-- </main> -->\n<!-- </div class=\"govuk-width-container\"> -->\n", styles: [".govuk-grid-column-full--gr{position:relative;margin-bottom:10px}.disable{text-decoration:none;cursor:default;color:#fff;background-color:gray;pointer-events:none}.govuk-grid__surplus-payments{margin:20px 0}.govuk-grid__surplus-payments>.govuk-grid-column-full{padding:0}.govuk-grid__surplus-payments-col1{margin-bottom:10px}.govuk-inset-text__no-border{border-left:0px}.govuk-hidetext{font-size:22px;padding-bottom:10px}.lowercase{text-transform:lowercase}.channel:first-letter{text-transform:uppercase}.govuk-heading-xl{font-size:48px;margin-bottom:1px}.govuk-section-break--visible{border-bottom:2px solid black}.totalpayments.govuk-table__row{border-bottom:2px solid black!important}.govuk-inset-text{margin-left:1em}.govuk-button{font-size:19px;margin-bottom:0!important}.groupamount.govuk-table__header,.govuk-table__cell.govuk-table__cell--col6.govuk-table__custom--col6{text-align:right}.feeclass{padding-left:.7em}.align-center{text-align:center}details summary{display:list-item}.case-transaction__color{color:#a71414;font-weight:700;text-align:center}.capitalize:first-letter{text-transform:uppercase}.govuk-inset-text__no-left-margin{margin-left:0;padding-left:0}.whitespace-inherit{white-space:inherit!important}.govuk-section-records-break{margin:10px;border-bottom:2px solid black!important}.exisitng-fees{margin-left:12px}.add-telephony-payment{margin-top:-2em;margin-left:-2em}.govuk-table__header--custom{text-align:center}.disable-link{cursor:default;pointer-events:none;color:#8e8c8c}.panel-no--style{border-left-style:none}.col-28{width:28%!important}.col-8{width:8%!important}.col-60{width:60%!important}.col-32{width:32%!important}.col-34{width:34%!important}.col-15{width:15%!important;padding-right:0!important;padding-left:0!important}.col-16{width:16%!important}.col-14{width:14%!important}.col-17{width:17%!important}.col-12{width:12%!important}.col-9{width:9%!important}.col-10{width:10%!important}.col-11{width:11%!important}.col-13{width:13%!important}.col-21{width:21%!important}.col-20{width:20%!important}.col-24{width:24%!important}.govuk-table__cell,.govuk-table__header{padding:10px 10px 10px 0}.col-27{width:27%!important}td{white-space:nowrap;overflow:hidden!important}.col-19{width:19%!important;padding-left:0!important}.col-18{width:18%!important;padding-left:0!important;padding-right:0!important}.col-37{width:37%!important}.col-55{width:55%!important}.govuk-table{margin-bottom:1px}.hmcts-banner>.hmcts-banner__message{font-size:19px;line-height:1.25}.summary-table-font{font-size:36px}.order-class{padding-top:3em}.govuk-table__header:last-child{text-align:right}.govuk-table__cell:last-child{text-align:right}.govuk-grid-column-two-thirds{width:64%!important;padding:0!important}.govuk-heading-l{font-size:36px;margin-bottom:10px}.govuk-heading-lw{width:70%}.paymentrequest{margin-top:1em}.mar-17{margin-left:17px}.col-61{width:61px!important;padding:0!important}.error{width:960px;margin:auto}.summarypage{padding-left:36em;margin-top:2em}.summarypagealign{width:100%;text-align:right;margin-top:2em}.govuk-inset-text{font-size:2.1875rem}table{table-layout:fixed;width:100%}th,td{word-wrap:break-word}.totalPay{padding-right:14px;float:right;margin-top:2em}.govuk-back-link{font-size:1.5rem!important}.totalfees{float:right;margin-top:2em}.refundBtn{text-align:right;width:18%}.col-25{width:25%!important}.of-visible{overflow:visible!important}.col-51{width:51%!important}.alignright{text-align:right}.alignleft{text-align:left}.alignself{align-self:flex-end}.maxwidth{width:100%}.govuk-padding-btm{padding-bottom:50px}.govuk-margin-btm-20px{margin-bottom:20px}\n"], dependencies: [{ kind: "ngmodule", type: i0.forwardRef(() => CommonModule) }, { kind: "directive", type: i0.forwardRef(() => i3.NgClass), selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i0.forwardRef(() => i3.NgForOf), selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i0.forwardRef(() => i3.NgIf), selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i0.forwardRef(() => ServiceRequestComponent), selector: "ccpay-service-request", inputs: ["LOGGEDINUSERROLES", "viewStatus", "orderDetail", "orderRef", "orderStatus", "orderParty", "orderCreated", "orderCCDEvent", "orderFeesTotal", "orderTotalPayments", "orderRemissionTotal", "paymentGroupList", "takePayment", "ccdCaseNumber", "isServiceRequest"], outputs: ["goToServiceRquestComponent"] }, { kind: "component", type: i0.forwardRef(() => UnprocessedPaymentsComponent), selector: "ccpay-app-unprocessed-payments", inputs: ["FEE_RECORDS_EXISTS", "PAYMENTREF", "ISTURNOFF", "IS_BUTTON_ENABLE", "IS_OS_AMT_AVAILABLE", "ISSFENABLE", "PAYMENTSLENGTH", "LEVEL", "CCD_CASE_NUMBER", "SELECTED_OPTION", "DCN_NUMBER", "ISBSENABLE", "CASETYPE"], outputs: ["selectedUnprocessedFeeEvent", "getUnprocessedFeeCount", "setBspaymentdcn", "setViewName", "setUnProcessedPaymentServiceId", "setPaymentGroupReference"] }, { kind: "component", type: i0.forwardRef(() => AddRemissionComponent), selector: "ccpay-add-remission", inputs: ["fee", "fees", "payment", "remission", "ccdCaseNumber", "caseType", "viewCompStatus", "paymentGroupRef", "isTurnOff", "isRefundRemission", "isStrategicFixEnable", "paidAmount", "isFromRefundListPage", "isFromPaymentDetailPage", "isFromServiceRequestPage", "isFullyRefund", "feeamount", "refundPaymentReference", "isFromRefundStatusPage", "changeRefundReason", "isServiceRequest", "LOGGEDINUSERROLES", "orderDetail", "orderRef", "orderStatus", "orderParty", "orderCreated", "orderCCDEvent", "takepayment", "orderFeesTotal", "orderTotalPayments", "orderRemissionTotal"], outputs: ["cancelRemission", "refundListReason", "refundListAmount", "refundFees"] }, { kind: "component", type: i0.forwardRef(() => RefundStatusComponent), selector: "ccpay-refund-status", inputs: ["LOGGEDINUSERROLES", "API_ROOT", "ccdCaseNumber", "isTurnOff", "orderParty"] }, { kind: "ngmodule", type: i0.forwardRef(() => FormsModule) }, { kind: "directive", type: i0.forwardRef(() => i1$1.ɵNgNoValidate), selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i0.forwardRef(() => i1$1.NgControlStatusGroup), selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i0.forwardRef(() => i1$1.NgForm), selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: i0.forwardRef(() => RpxTranslationModule) }, { kind: "pipe", type: i0.forwardRef(() => i3.LowerCasePipe), name: "lowercase" }, { kind: "pipe", type: i0.forwardRef(() => i3.CurrencyPipe), name: "currency" }, { kind: "pipe", type: i0.forwardRef(() => i3.DatePipe), name: "date" }, { kind: "pipe", type: i0.forwardRef(() => CcdHyphensPipe), name: "ccdHyphens" }, { kind: "pipe", type: i0.forwardRef(() => i8.RpxTranslatePipe), name: "rpxTranslate" }] });
2914
+ addCurrency(total, amount) {
2915
+ return (this.toPence(total) + this.toPence(amount)) / 100;
2916
+ }
2917
+ toPence(amount) {
2918
+ return Math.round(Number(amount) * 100);
2919
+ }
2920
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: CaseTransactionsComponent, deps: [{ token: i1$2.Router }, { token: PaymentViewService }, { token: BulkScaningPaymentService }, { token: CaseTransactionsService }, { token: 'PAYMENT_LIB' }, { token: OrderslistService }], target: i0.ɵɵFactoryTarget.Component });
2921
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: CaseTransactionsComponent, isStandalone: true, selector: "ccpay-case-transactions", inputs: { LOGGEDINUSERROLES: "LOGGEDINUSERROLES", isTakePayment: "isTakePayment", isFromServiceRequestPage: "isFromServiceRequestPage" }, ngImport: i0, template: "<div>\n <main>\n <ng-container *ngIf=\"viewStatus === 'main1'\">\n <div *ngIf=\"viewStatus === 'main1'&& !isTurnOff && takePayment\">\n <div *ngIf=\"takePayment\" class=\"govuk-grid-row\">\n\n <div class=\"govuk-grid-column-two-thirds\">\n <h1 class=\"govuk-heading-xl\">Case transactions</h1>\n </div>\n </div>\n\n <div *ngIf=\"takePayment\" class=\"govuk-grid-row\">\n <div *ngIf='!isExceptionRecord' class=\"govuk-grid-column-two-thirds govuk-!-padding-bottom-6 govuk-!-padding-top-6\">\n <h3 class=\"heading-medium\">CCD reference:</h3>\n <span> {{ ccdCaseNumber | ccdHyphens }}</span>\n </div>\n\n <div *ngIf='isExceptionRecord' class=\"govuk-grid-column-two-thirds govuk-!-padding-bottom-6 govuk-!-padding-top-6\">\n <h3 class=\"heading-medium\">Exception reference:</h3>\n <span> {{ ccdCaseNumber | ccdHyphens }}</span>\n </div>\n <div class=\"govuk-grid-column-full govuk-!-padding-bottom-3\">\n <hr class=\"govuk-section-break govuk-section-break--visible\">\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\">Total payments</td>\n <td class=\"govuk-table__header\" scope=\"col\">Total remissions</td>\n <td class=\"govuk-table__header\" scope=\"col\">Amount due</td>\n <td class=\"govuk-table__header govuk-table__header--custom\" scope=\"col\" *ngIf=\"isBulkScanEnable\">Unallocated payments</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\">\n <tr class=\"totalpayments govuk-table__row\">\n <td class=\"govuk-table__cell summary-table-font\">{{ totalPayments | currency :'GBP':'symbol':'1.2-2' }}</td>\n <td class=\"govuk-table__cell summary-table-font\">{{ totalRemissions | currency :'GBP':'symbol':'1.2-2' }}</td>\n <td class=\"govuk-table__cell summary-table-font\">{{ clAmountDue | currency :'GBP':'symbol':'1.2-2'}}</td>\n <td class=\"govuk-table__cell case-transaction__color summary-table-font\" *ngIf=\"isBulkScanEnable\">{{unprocessedRecordCount}}</td>\n </tr>\n </tbody>\n </table>\n </div>\n\n <div class=\"govuk-grid-column-two-thirds\" *ngIf=\"takePayment\">\n <button type=\"submit\" (click)=\"redirectToFeeSearchPage($event)\"\n [disabled]=\"!isAddFeeBtnEnabled\"\n [ngClass]='!isAddFeeBtnEnabled ? \"govuk-button govuk-button--secondary govuk-button--disabled govuk-!-margin-right-1\" : \"govuk-button govuk-button--secondary govuk-!-margin-right-1\"'>\n Take telephony payment\n </button>\n </div>\n\n </div>\n <div class=\"govuk-grid-row\">\n\n </div>\n <div *ngIf=\"takePayment\" class=\" govuk-!-margin-top-9\">\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-full\">\n <h3 class=\"heading-medium\">Fees</h3>\n </div>\n <div class=\"govuk-grid-column-full\">\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\">Code</td>\n <td class=\"govuk-table__header\" scope=\"col\">Description</td>\n <td class=\"govuk-table__header\" scope=\"col\">Volume</td>\n <td class=\"govuk-table__header\" scope=\"col\">Fee amount</td>\n <td class=\"govuk-table__header\" scope=\"col\">Calculated amount</td>\n <td class=\"govuk-table__header\" scope=\"col\">Amount due</td>\n <td class=\"govuk-table__header\" scope=\"col\">Action</td>\n\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\" *ngFor=\"let paymentGroup of paymentGroups;\">\n <tr class=\"govuk-table__row\" *ngFor=\"let fee of paymentGroup.fees; let i = index;\">\n <td class=\"govuk-table__cell\">\t{{fee.code}} </td>\n <td class=\"govuk-table__cell\">{{fee.description}}</td>\n <td class=\"govuk-table__cell\">{{fee.volume? fee.volume : '-'}}</td>\n <td class=\"govuk-table__cell\">{{ fee.net_amount | currency:'GBP':'symbol-narrow':'1.2-2' }}</td>\n <td class=\"govuk-table__cell\">{{fee.calculated_amount | currency:'GBP':'symbol-narrow':'1.2-2' }}</td>\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\" [attr.rowspan]=\"paymentGroup.fees.length\" *ngIf=\"paymentGroup.old && i==0\"> {{getGroupOutstandingAmount(paymentGroup)| currency:'GBP':'symbol-narrow':'1.2-2'}}* </td>\n <td class=\"govuk-table__cell\" *ngIf=\"!paymentGroup.old\"> {{calculateAmountDue(fee) | currency:'GBP':'symbol-narrow':'1.2-2'}} </td>\n <td class=\"govuk-table__cell\" *ngIf=\"!paymentGroup.old\">\n <a (click)=\"confirmRemoveFee(fee.id)\" [ngClass]='!isCheckAmountdueExist(fee.amount_due) || fee.remissions ? \"disable-link\" : \"\"'>Remove</a>\n </td>\n <td class=\"govuk-table__cell\" *ngIf=\"paymentGroup.old\">\n <a (click)=\"confirmRemoveFee(fee.id)\" [ngClass]='paymentGroup.payments?.length > 0 || paymentGroup.remissions?.length > 0 ? \"disable-link\" : \"\"'>Remove</a>\n </td>\n </tr>\n </tbody>\n <tbody class=\"govuk-table__body\" *ngIf=\"paymentGroups?.length === 0\">\n <tr class=\"govuk-table__row\" >\n <td class=\"govuk-table__cell\" colspan=\"7\">No fees recorded</td>\n </tr>\n </tbody>\n </table>\n </div>\n </div>\n <div class=\"hmcts-banner\" *ngIf=\"isHistoricGroupAvailable\">\n <svg class=\"hmcts-banner__icon\" fill=\"currentColor\" role=\"presentation\" focusable=\"false\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 25 25\" height=\"25\" width=\"25\">\n <path d=\"M13.7,18.5h-2.4v-2.4h2.4V18.5z M12.5,13.7c-0.7,0-1.2-0.5-1.2-1.2V7.7c0-0.7,0.5-1.2,1.2-1.2s1.2,0.5,1.2,1.2v4.8\n C13.7,13.2,13.2,13.7,12.5,13.7z M12.5,0.5c-6.6,0-12,5.4-12,12s5.4,12,12,12s12-5.4,12-12S19.1,0.5,12.5,0.5z\"></path>\n </svg>\n <div class=\"hmcts-banner__message\">\n <span class=\"hmcts-banner__assistive\">information</span>\n * These fees have already been processed offline. Check the notes in CCD for more information.\n </div>\n </div>\n <div class=\"panel panel-no--style\" *ngIf=\"allPayments?.length > 0 || remissions?.length > 0\">\n <!-- payments -->\n <h3 class=\"heading-medium\">Payments</h3>\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header col-28\" scope=\"col\">Payment reference</td>\n <td class=\"govuk-table__header\" scope=\"col\">Date created</td>\n <td class=\"govuk-table__header\" scope=\"col\">Channel</td>\n <td class=\"govuk-table__header\" scope=\"col\">Method</td>\n <td class=\"govuk-table__header col-15\" scope=\"col\">Amount</td>\n <td class=\"govuk-table__header\" scope=\"col\">Allocation status</td>\n <td class=\"govuk-table__header\" scope=\"col\">Payment status</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\" *ngIf=\"allPayments?.length > 0\">\n <tr class=\"govuk-table__row\" *ngFor=\"let payment of allPayments\">\n <td class=\"govuk-table__cell whitespace-inherit\">\n <a href=\"javascript:void(0)\" (click)=\"goToPayementView(payment.paymentGroupReference, payment.reference, payment.method)\">{{ payment.reference }}</a>\n </td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ payment.date_created | date:'dd MMM yyyy' }}</td>\n <td class=\"channel govuk-table__cell whitespace-inherit\">{{ payment.channel | lowercase }}</td>\n <td class=\"govuk-table__cell capitalize whitespace-inherit\">{{ payment.method | lowercase}}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ payment.amount | currency:'GBP':'symbol-narrow':'1.2-2' }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\"> {{getAllocationStatus(payment)}}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ payment.status }}</td>\n </tr>\n </tbody>\n <tbody class=\"govuk-table__body\" *ngIf=\"allPayments?.length === 0\">\n <td class=\"govuk-table__cell\" colspan=\"7\">No payments recorded</td>\n </tbody>\n </table>\n\n <!-- remissions -->\n <h3 class=\"heading-medium\">Remissions</h3>\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\">Remission reference</td>\n <td class=\"govuk-table__header\" scope=\"col\">Date created</td>\n <td class=\"govuk-table__header\" scope=\"col\">Remission code</td>\n <td class=\"govuk-table__header\" scope=\"col\">Fee code</td>\n <td class=\"govuk-table__header\" scope=\"col\">Remission amount</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\" *ngIf=\"remissions?.length > 0\">\n <tr class=\"govuk-table__row\" *ngFor=\"let remission of remissions\">\n <td class=\"govuk-table__cell whitespace-inherit\">{{ remission.remission_reference }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ remission.date_created | date:'dd MMM yyyy' }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ remission.hwf_reference }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ remission.fee_code }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ remission.hwf_amount | currency:'GBP':'symbol-narrow':'1.2-2'}}</td>\n </tr>\n </tbody>\n <tbody class=\"govuk-table__body\" *ngIf=\"remissions?.length === 0\">\n <td class=\"govuk-table__cell\" colspan=\"5\">No remissions recorded</td>\n </tbody>\n </table>\n </div>\n </div>\n </div>\n\n <div *ngIf=\"takePayment && isTurnOff\">\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n <h1 class=\"govuk-heading-xl\">Case transactions</h1>\n </div>\n\n <div class=\"govuk-grid-column-one-third\" align=\"right\" >\n <a [ngClass]=\"{ 'disable': !isAddFeeBtnEnabled} \" (click)=\"redirectToFeeSearchPage($event)\" class=\"button\">Add a new fee</a>\n </div>\n </div>\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds govuk-!-padding-bottom-6\">\n <h3 class=\"heading-medium\">CCD reference:</h3>\n <span> {{ ccdCaseNumber | ccdHyphens }}</span>\n </div>\n\n <div class=\"govuk-grid-column-full govuk-!-padding-bottom-3\">\n <hr class=\"govuk-section-break govuk-section-break--visible\">\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\">Total payments</td>\n <td class=\"govuk-table__header\" scope=\"col\">Total remissions</td>\n <td class=\"govuk-table__header\" scope=\"col\">Amount due</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\">\n <tr class=\"totalpayments govuk-table__row\">\n <td class=\"govuk-table__cell\">{{ totalPayments | currency :'GBP':'symbol':'1.2-2' }}</td>\n <td class=\"govuk-table__cell\">{{ totalRemissions | currency :'GBP':'symbol':'1.2-2' }}</td>\n <td class=\"govuk-table__cell\">{{ (totalFees - totalRemissions) - totalPayments | currency :'GBP':'symbol':'1.2-2'}}</td>\n </tr>\n </tbody>\n </table>\n </div>\n </div>\n\n\n <!-- No fees start -->\n <div *ngIf=\"paymentGroups?.length === 0\">\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-full\">\n <span class=\"heading-small\">Existing fees</span>\n </div>\n\n <div class=\"govuk-grid-column-full\">\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\">Code</td>\n <td class=\"govuk-table__header\" scope=\"col\">Description</td>\n <td class=\"govuk-table__header\" scope=\"col\">Volume</td>\n <td class=\"govuk-table__header\" scope=\"col\">Fee amount</td>\n <td class=\"govuk-table__header\" scope=\"col\">Calculated amount</td>\n <td class=\"govuk-table__header\" scope=\"col\">Group amount outstanding</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell\" colspan=\"6\">No fees recorded</td>\n </tr>\n </tbody>\n </table>\n </div>\n </div>\n </div>\n\n <!-- No fees end -->\n\n <div *ngFor=\"let paymentGroup of paymentGroups\">\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-full govuk-grid-column-full--gr\">\n <span class=\"heading-medium\">Group reference: {{paymentGroup.payment_group_reference}}</span>\n </div>\n </div>\n <div class=\"govuk-grid-row\">\n\n <!--New Code start-->\n\n <div class=\"govuk-grid-column-full\">\n <span class=\"heading-small\">Exisiting fees</span>\n </div>\n <div class=feeclass>\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\">Code</td>\n <td class=\"govuk-table__header\" scope=\"col\">Description</td>\n <td class=\"govuk-table__header\" scope=\"col\">Volume</td>\n <td class=\"govuk-table__header\" scope=\"col\">Fee amount</td>\n <td class=\"govuk-table__header\" scope=\"col\">Calculated amount</td>\n <td class=\"groupamount govuk-table__header\" scope=\"col\">Group amount outstanding</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\" >\n <tr class=\"govuk-table__row\" *ngFor=\"let fee of paymentGroup.fees; let i = index;\">\n <td class=\"govuk-table__cell govuk-table__cell--col1\">{{fee.code}}</td>\n <td class=\"govuk-table__cell govuk-table__cell--col2\"> {{fee.description}} </td>\n <td class=\"govuk-table__cell govuk-table__cell--col3 align-center\"> {{fee.volume? fee.volume : '-'}} </td>\n <td class=\"govuk-table__cell govuk-table__cell--col4\"> {{ fee.net_amount | currency:'GBP':'symbol-narrow':'1.2-2' }} </td>\n <td class=\"govuk-table__cell govuk-table__cell--col5\"> {{fee.calculated_amount | currency:'GBP':'symbol-narrow':'1.2-2' }} </td>\n <td class=\"govuk-table__cell govuk-table__cell--col6 govuk-table__custom--col6\" [attr.rowspan]=\"paymentGroup.fees.length\" *ngIf=\"i==0\">\n {{getGroupOutstandingAmount(paymentGroup) | currency:'GBP':'symbol-narrow':'1.2-2' }} </td>\n </tr>\n </tbody>\n <tbody class=\"govuk-table__body\" *ngIf=\"paymentGroup.fees.length==0\">\n <td class=\"govuk-table__cell\" colspan=\"6\">No payments recorded</td>\n </tbody>\n </table>\n </div>\n </div>\n <div class=\"govuk-inset-text govuk-inset-text__no-border\" *ngIf=\"paymentGroup.payments || paymentGroup.remissions\">\n <details>\n <summary class=\"govuk-hidetext\">\n <span class=\"summary\">Allocated payments and remissions</span>\n </summary>\n\n <div class=\"panel panel-border-narrow\">\n <!-- payments -->\n <span class=\"heading-medium\">Payments</span>\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\">Payment reference</td>\n <td class=\"govuk-table__header\" scope=\"col\">Date created</td>\n <td class=\"govuk-table__header\" scope=\"col\">Channel</td>\n <td class=\"govuk-table__header\" scope=\"col\">Method</td>\n <td class=\"govuk-table__header\" scope=\"col\">Amount</td>\n <td class=\"govuk-table__header\" scope=\"col\">Allocation status</td>\n <td class=\"govuk-table__header\" scope=\"col\">Status</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\" *ngIf=\"paymentGroup.payments?.length > 0\">\n <tr class=\"govuk-table__row\" *ngFor=\"let payment of paymentGroup.payments\">\n <td class=\"govuk-table__cell whitespace-inherit\">\n <a href=\"javascript:void(0)\" (click)=\"goToPayementView(paymentGroup.payment_group_reference, payment.reference, payment.method)\">{{ payment.reference }}</a>\n </td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ payment.date_created | date:'dd MMM yyyy' }}</td>\n <td class=\"channel govuk-table__cell whitespace-inherit\">{{ payment.channel | lowercase }}</td>\n <td class=\"govuk-table__cell capitalize whitespace-inherit\">{{ payment.method | lowercase}}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ payment.amount }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\"> {{getAllocationStatus(payment)}}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ payment.status }}</td>\n </tr>\n </tbody>\n <tbody class=\"govuk-table__body\" *ngIf=\"paymentGroup.payments?.length === 0\">\n <td class=\"govuk-table__cell\" colspan=\"6\">No payments recorded</td>\n </tbody>\n </table>\n\n <!-- remissions -->\n <span class=\"heading-medium\">Remissions</span>\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\">Remission reference</td>\n <td class=\"govuk-table__header\" scope=\"col\">Date created</td>\n <td class=\"govuk-table__header\" scope=\"col\">Remission code</td>\n <td class=\"govuk-table__header\" scope=\"col\">Fee applied against</td>\n <td class=\"govuk-table__header\" scope=\"col\">Remission amount</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\" *ngIf=\"paymentGroup.remissions?.length > 0\">\n <tr class=\"govuk-table__row\" *ngFor=\"let remission of paymentGroup.remissions\">\n <td class=\"govuk-table__cell whitespace-inherit\">{{ remission.remission_reference }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ remission.date_created | date:'dd MMM' }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ remission.hwf_reference }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ remission.fee_code }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ remission.hwf_amount }}</td>\n </tr>\n </tbody>\n <tbody class=\"govuk-table__body\" *ngIf=\"paymentGroup.remissions?.length === 0\">\n <td class=\"govuk-table__cell\" colspan=\"5\">No remissions recorded</td>\n </tbody>\n </table>\n </div>\n </details>\n\n\n <div *ngIf=\"takePayment\">\n <button type=\"submit\" (click)=\"loadFeeSummaryPage(paymentGroup)\"\n [disabled]=\"(getGroupOutstandingAmount(paymentGroup) <= 0 || isUnprocessedRecordSelected)\"\n [ngClass]='(getGroupOutstandingAmount(paymentGroup) <= 0 || isUnprocessedRecordSelected) ? \"govuk-button govuk-button--secondary govuk-button--disabled govuk-!-margin-right-1\" : \"govuk-button govuk-button--secondary govuk-!-margin-right-1\"'>\n Add telephone payment\n </button>\n </div>\n </div>\n </div>\n <ccpay-app-unprocessed-payments\n *ngIf=\"isBulkScanEnable\"\n [IS_BUTTON_ENABLE]=\"takePayment\"\n [LEVEL]=\"5\"\n [PAYMENTSLENGTH]=\"allPayments?.length\"\n [PAYMENTREF]=\"paymentRef\"\n [ISTURNOFF]=\"isTurnOff\"\n [ISSFENABLE]=\"isStrategicFixEnable\"\n [FEE_RECORDS_EXISTS]=\"isFeeRecordsExist\"\n (getUnprocessedFeeCount) = \"getUnprocessedFeeCount($event)\"\n [IS_OS_AMT_AVAILABLE]=\"isGrpOutstandingAmtPositive\"\n [CCD_CASE_NUMBER]=\"ccdCaseNumber\"\n [SELECTED_OPTION]=\"selectedOption\"\n [DCN_NUMBER]=\"dcnNumber\"\n [ISBSENABLE]=\"isBulkScanEnable\"\n [CASETYPE]=\"caseType\"\n (selectedUnprocessedFeeEvent) = \"selectedUnprocessedFeeEvent($event)\"\n (setBspaymentdcn) = \"setBspaymentdcn($event)\"\n (setViewName) = \"setViewName($event)\"\n (setUnProcessedPaymentServiceId) = \"setUnProcessedPaymentServiceId($event)\"\n (setPaymentGroupReference) = \"setPaymentGroupReference($event)\">\n </ccpay-app-unprocessed-payments>\n <div class=\"govuk-grid-row govuk-grid__surplus-payments\" *ngIf=\"totalRefundAmount > 0 && takePayment\">\n <div class=\"govuk-grid-column-full govuk-grid__surplus-payments-col1\">\n <h3 class=\"heading-medium\">Surplus payments</h3>\n </div>\n <div class=\"govuk-grid-column-full\">\n Total surplus payments received: {{totalRefundAmount | currency :'GBP':'symbol':'1.2-2'}}\n </div>\n </div>\n </div>\n\n <div *ngIf=\"takePayment\">\n <ccpay-app-unprocessed-payments\n *ngIf=\"isBulkScanEnable && !takePayment\"\n [IS_BUTTON_ENABLE]=\"takePayment\"\n [LEVEL]=\"1\"\n [ISTURNOFF]=\"isTurnOff\"\n [ISSFENABLE]=\"isStrategicFixEnable\"\n [FEE_RECORDS_EXISTS]=\"isFeeRecordsExist\"\n [IS_OS_AMT_AVAILABLE]=\"isGrpOutstandingAmtPositive\"\n (getUnprocessedFeeCount) = \"getUnprocessedFeeCount($event)\"\n [PAYMENTSLENGTH]=\"allPayments?.length\"\n [PAYMENTREF]=\"paymentRef\"\n [CCD_CASE_NUMBER]=\"ccdCaseNumber\"\n [SELECTED_OPTION]=\"selectedOption\"\n [DCN_NUMBER]=\"dcnNumber\"\n [ISBSENABLE]=\"isBulkScanEnable\"\n [CASETYPE]=\"caseType\"\n (selectedUnprocessedFeeEvent) = \"selectedUnprocessedFeeEvent($event)\"\n (setBspaymentdcn) = \"setBspaymentdcn($event)\"\n (setViewName) = \"setViewName($event)\"\n (setUnProcessedPaymentServiceId) = \"setUnProcessedPaymentServiceId($event)\"\n (setPaymentGroupReference) = \"setPaymentGroupReference($event)\">\n </ccpay-app-unprocessed-payments>\n </div>\n\n <div *ngIf=\"!takePayment\" class=\"govuk-grid-row govuk-grid__surplus-payments\">\n\n <div class=\"govuk-grid-column-full\">\n\n <span class=\"heading-medium\">{{ \"Payments\" | rpxTranslate }}</span>\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header col-13\" scope=\"col\">{{ \"Status\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-10\" scope=\"col\">{{ \"Amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-14\" scope=\"col\">{{ \"Date allocated\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-20\" scope=\"col\">{{ \"Request reference\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-9\" scope=\"col\"></td>\n <td class=\"govuk-table__header\" scope=\"col\"></td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\" *ngIf=\"allPayments?.length > 0\">\n <tr class=\"govuk-table__row\" *ngFor=\"let payment of allPayments\">\n <td class=\"govuk-table__cell col-13 whitespace-inherit\">{{ payment.status | rpxTranslate }}</td>\n <td class=\"govuk-table__cell col-10 whitespace-inherit\">{{ payment.amount | currency :'GBP':'symbol':'1.2-2' }}</td>\n <td class=\"govuk-table__cell col-17 whitespace-inherit\">{{ payment.date_created | date:'dd MMM yyyy HH:mm:ss' }}</td>\n <td class=\"govuk-table__cell col-24 whitespace-inherit\">{{ payment.paymentGroupReference }}</td>\n <td class=\"govuk-table__cell col-13 whitespace-inherit\"></td>\n <td class=\"govuk-table__cell whitespace-inherit\">\n <a href=\"javascript:void(0)\" (click)=\"goToPayementView(payment.paymentGroupReference, payment.reference, payment.method)\">{{ \"Review\" | rpxTranslate }}</a>\n </td>\n </tr>\n </tbody>\n\n </table>\n <ccpay-app-unprocessed-payments class=\"govuk-table\"\n *ngIf=\"isBulkScanEnable && !takePayment\"\n [IS_BUTTON_ENABLE]=\"takePayment\"\n [LEVEL]=\"2\"\n [ISTURNOFF]=\"isTurnOff\"\n [ISSFENABLE]=\"isStrategicFixEnable\"\n [FEE_RECORDS_EXISTS]=\"isFeeRecordsExist\"\n [IS_OS_AMT_AVAILABLE]=\"isGrpOutstandingAmtPositive\"\n [PAYMENTSLENGTH]=\"allPayments?.length\"\n [PAYMENTREF]=\"paymentRef\"\n [CCD_CASE_NUMBER]=\"ccdCaseNumber\"\n [SELECTED_OPTION]=\"selectedOption\"\n [DCN_NUMBER]=\"dcnNumber\"\n [ISBSENABLE]=\"isBulkScanEnable\"\n [CASETYPE]=\"caseType\"\n (getUnprocessedFeeCount) = \"getUnprocessedFeeCount($event)\"\n (selectedUnprocessedFeeEvent) = \"selectedUnprocessedFeeEvent($event)\"\n (setBspaymentdcn) = \"setBspaymentdcn($event)\"\n (setViewName) = \"setViewName($event)\"\n (setUnProcessedPaymentServiceId) = \"setUnProcessedPaymentServiceId($event)\"\n (setPaymentGroupReference) = \"setPaymentGroupReference($event)\">\n </ccpay-app-unprocessed-payments>\n </div>\n </div>\n </ng-container>\n\n<!--Order Case Transactions Page-->\n <ng-container *ngIf=\"viewStatus === 'main' && !isTurnOff && takePayment\">\n <div>\n\n <div>\n <h1 class=\"govuk-grid-column-two-thirds govuk-heading-l govuk-!-margin-top-0\">Case transactions</h1>\n <ng-container *ngIf='!isExceptionRecord' class=\" govuk-!-margin-bottom-6 alignself\">\n <b> Case reference: </b>{{ ccdCaseNumber | ccdHyphens }}\n </ng-container>\n <ng-container *ngIf='isExceptionRecord' class=\"govuk-!-margin-bottom-3 col-55 alignself\" >\n <b> Exception reference:</b>{{ ccdCaseNumber | ccdHyphens }}\n </ng-container>\n <div>\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header col-25\" scope=\"col\">Total payments</td>\n <td class=\"govuk-table__header govuk-table__header--custom col-25\" scope=\"col\" *ngIf=\"isBulkScanEnable\">Unallocated payments</td>\n <td class=\"govuk-table__header col-25\" scope=\"col\">Total remissions</td>\n <td class=\"govuk-table__header col-20\" scope=\"col\">Amount due</td>\n <td class=\"govuk-table__header col-20\" scope=\"col\">Over payment</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\">\n <tr class=\"totalpayments govuk-table__row\">\n <td class=\"govuk-table__cell summary-table-font\">{{ totalPayments | currency :'GBP':'symbol':'1.2-2' }}</td>\n <td class=\"govuk-table__cell case-transaction__color summary-table-font\" *ngIf=\"isBulkScanEnable\">{{unprocessedRecordCount}}</td>\n\n <td class=\"govuk-table__cell summary-table-font\">{{ totalRemissions | currency :'GBP':'symbol':'1.2-2' }}</td>\n <td class=\"govuk-table__cell summary-table-font\">{{ clAmountDue | currency :'GBP':'symbol':'1.2-2'}}</td>\n <td class=\"govuk-table__cell summary-table-font\">{{ overPaymentAmount | currency :'GBP':'symbol':'1.2-2'}}</td>\n\n </tr>\n </tbody>\n </table>\n </div>\n </div>\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='ORDERIDDETAILS'>\n\n <!--Payment Request-->\n <div class=\"paymentrequest\">\n <span class=\"heading-medium\">{{ \"Service requests\" | rpxTranslate }}</span>\n <ng-container>\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header col-14\" scope=\"col\">{{ \"Status\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-10\" scope=\"col\">{{ \"Amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-18\" scope=\"col\">{{ \"Party\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-21\" scope=\"col\">{{ \"Request reference\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-9\" scope=\"col\"></td>\n <td class=\"govuk-table__header col\" scope=\"col\"></td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\" *ngIf=\"orderLevelFees?.length > 0\">\n <tr *ngFor=\"let orderRef of orderLevelFees;let i = index;\">\n <td class=\"govuk-table__cell whitespace-inherit\">{{ orderRef.orderStatus | rpxTranslate }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ orderRef.orderTotalFees | currency :'GBP':'symbol':'1.2-2' }}</td>\n <td *ngIf=\"cpoDetails !== null && cpoDetails.length !== 0\" class=\"govuk-table__cell whitespace-inherit\">\n <ng-container *ngFor=\"let cpo of cpoDetails\">\n <ng-container *ngIf=\"cpo.orderReference == orderRef.orderRefId\">\n {{cpo.responsibleParty}}\n </ng-container>\n </ng-container>\n </td>\n <td *ngIf=\"cpoDetails === null || cpoDetails.length === 0\" class=\"govuk-table__cell whitespace-inherit\"></td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{orderRef.orderRefId}}</td>\n <td class=\"govuk-table__cell\">\n <a href=\"javascript:void(0)\" (click)=\"goToOrderViewDetailSection(orderRef)\">{{ \"Review\" | rpxTranslate }}</a>\n </td>\n <td class=\"alignright\">\n\n <button type=\"submit\" (click)=\"redirectToOrderFeeSearchPage($event,orderRef)\"\n [disabled]=\"!orderRef.orderAddBtnEnable\"\n [ngClass]='!orderRef.orderAddBtnEnable ? \"govuk-button govuk-button--secondary govuk-button--disabled govuk-!-margin-right-1\" : \"govuk-button govuk-button--secondary govuk-!-margin-right-1\"'>\n {{ \"Take telephony payment\" | rpxTranslate }}\n </button></td>\n </tr>\n </tbody>\n <tbody class=\"govuk-table__body alignleft\" *ngIf=\"orderLevelFees?.length === 0\">\n <td colspan=\"6\">{{ \"No service requests on this case.\" | rpxTranslate }}</td>\n </tbody>\n </table>\n </ng-container>\n <!-- <ng-container *ngIf=\"orderLevelFees?.length === 0\">\n <br/>No service requests on this case.<br/>\n </ng-container> -->\n <span>\n <br/>\n <a (click)=\"redirectToFeeSearchPage($event)\"\n [class.disable-link]=\"!isAddFeeBtnEnabled\">{{ \"Create service request and pay\" | rpxTranslate }}</a><br/>\n </span>\n </div>\n <div>\n <span class=\"heading-medium\"><br/>{{ \"Payments\" | rpxTranslate }}</span>\n <ccpay-app-unprocessed-payments\n *ngIf=\"isBulkScanEnable\"\n [IS_BUTTON_ENABLE]=\"takePayment\"\n [LEVEL]=\"3\"\n [PAYMENTSLENGTH]=\"allPayments?.length\"\n [ISTURNOFF]=\"isTurnOff\"\n [ISSFENABLE]=\"isStrategicFixEnable\"\n [PAYMENTREF]=\"paymentRef\"\n [FEE_RECORDS_EXISTS]=\"isFeeRecordsExist\"\n (getUnprocessedFeeCount) = \"getUnprocessedFeeCount($event)\"\n [IS_OS_AMT_AVAILABLE]=\"isGrpOutstandingAmtPositive\"\n [CCD_CASE_NUMBER]=\"ccdCaseNumber\"\n [SELECTED_OPTION]=\"selectedOption\"\n [DCN_NUMBER]=\"dcnNumber\"\n [ISBSENABLE]=\"isBulkScanEnable\"\n [CASETYPE]=\"caseType\"\n (selectedUnprocessedFeeEvent) = \"selectedUnprocessedFeeEvent($event)\"\n (setBspaymentdcn) = \"setBspaymentdcn($event)\"\n (setViewName) = \"setViewName($event)\"\n (setUnProcessedPaymentServiceId) = \"setUnProcessedPaymentServiceId($event)\"\n (setPaymentGroupReference) = \"setPaymentGroupReference($event)\">\n </ccpay-app-unprocessed-payments>\n\n <ng-container>\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n </thead>\n <tbody class=\"govuk-table__body\" *ngIf=\"allPayments?.length > 0\">\n <tr class=\"govuk-table__row\" *ngFor=\"let payment of allPayments\">\n <td class=\"govuk-table__cell col-14 whitespace-inherit\">{{ payment.status | rpxTranslate }}</td>\n <td class=\"govuk-table__cell col-10 whitespace-inherit\">{{ payment.amount | currency :'GBP':'symbol':'1.2-2' }}</td>\n <td class=\"govuk-table__cell col-17 whitespace-inherit\">{{ payment.date_created | date:'dd MMM yyyy' }}</td>\n <td class=\"govuk-table__cell col-24 whitespace-inherit\">{{ payment.paymentGroupReference }}</td>\n <td class=\"govuk-table__cell col-13 whitespace-inherit\"></td>\n <td class=\"govuk-table__cell whitespace-inherit\">\n <a href=\"javascript:void(0)\" (click)=\"goToPayementView(payment.paymentGroupReference, payment.reference, payment.method)\">{{ \"Review\" | rpxTranslate }}</a>\n </td>\n </tr>\n </tbody>\n\n <tbody class=\"govuk-table__body\" *ngIf=\"allPayments?.length === 0 && unprocessedRecordCount <= 0\">\n <td colspan=\"6\">{{ \"No payments recorded\" | rpxTranslate }}</td>\n </tbody>\n </table>\n\n </ng-container>\n\n </div>\n <div *ngIf=\"!check4AllowedRoles2AccessPBApayment()\">\n <span class=\"heading-medium\"><br/>{{ \"Refunds\" | rpxTranslate }}</span>\n <ccpay-refund-status\n [ccdCaseNumber]=\"ccdCaseNumber\"\n [isTurnOff]=\"isTurnOff\"\n [orderParty]=\"orderParty\"\n [LOGGEDINUSERROLES]=\"LOGGEDINUSERROLES\"\n ></ccpay-refund-status>\n </div>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"!takePayment && viewStatus === 'main'\">\n <div class=\"govuk-grid-column-full\" [ngClass]='serviceRequestValue!== \"false\" ? \"govuk-margin-btm-20px\" : \"\"'>\n <!-- <span *ngIf=\"serviceRequestValue === 'false'\" class=\"heading-medium\">Service requests</span> -->\n <ng-container *ngIf=\"!(orderLevelFees?.length === 0 && !isAnyFeeGroupAvilable) && serviceRequestValue !== 'false' \">\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header col-14\" scope=\"col\">{{ \"Status\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-18\" scope=\"col\">{{ \"Amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-18\" scope=\"col\">{{ \"Party\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-24\" scope=\"col\">{{ \"Request reference\t\" | rpxTranslate }}\n </td>\n <td class=\"govuk-table__header col-9\" scope=\"col\"></td>\n <td class=\"govuk-table__header\" scope=\"col\"></td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\" *ngIf=\"orderLevelFees?.length > 0\">\n <tr class=\"govuk-table__row\" *ngFor=\"let orderRef of orderLevelFees;let i = index;\">\n <td class=\"govuk-table__cell whitespace-inherit\">{{ orderRef.orderStatus | rpxTranslate }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{orderRef.orderTotalFees | currency :'GBP':'symbol':'1.2-2'}}</td>\n <td *ngIf=\"cpoDetails !== null && cpoDetails.length !== 0\" class=\"govuk-table__cell whitespace-inherit\">\n <ng-container *ngFor=\"let cpo of cpoDetails\">\n <ng-container *ngIf=\"cpo.orderReference == orderRef.orderRefId\">\n {{cpo.responsibleParty}}\n </ng-container>\n </ng-container>\n </td>\n <td *ngIf=\"cpoDetails === null || cpoDetails.length === 0\" class=\"govuk-table__cell whitespace-inherit\"></td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{orderRef.orderRefId}}</td>\n <td class=\"govuk-table__cell of-visible\"> <a href=\"javascript:void(0)\" (click)=\"loadPBAAccountPage(orderRef)\" *ngIf=\"serviceRequestValue !== 'false' && check4AllowedRoles2AccessPBApayment() && orderRef.orderStatus === 'Not paid'\"> {{ \"Pay now\" | rpxTranslate }}</a></td>\n <td class=\"govuk-table__cell\">\n <a href=\"javascript:void(0)\" (click)=\"goToOrderViewDetailSection(orderRef)\">{{ \"Review\" | rpxTranslate }}</a>\n </td>\n </tr>\n </tbody>\n <tbody class=\"govuk-table__body\" *ngIf=\"orderLevelFees?.length === 0 && serviceRequestValue === 'false'\">\n <tr class=\"govuk-table__row\" >\n <td class=\"alignleft\" colspan=\"7\">{{ \"No service requests on this case.\" | rpxTranslate }}</td>\n </tr>\n </tbody>\n </table>\n </ng-container>\n <ng-container *ngIf=\"orderLevelFees?.length === 0 && serviceRequestValue !== 'false' && !isAnyFeeGroupAvilable\">\n <h1 class=\"govuk-heading-l govuk-heading-lw\">{{ \"If you are expecting to pay and are not able to see a service request,\" | rpxTranslate }}</h1>\n <p>{{ \"please refresh and try in some time.\" | rpxTranslate }}</p>\n </ng-container>\n <!-- </div> -->\n </div>\n <div class=\"govuk-grid-column-full\">\n <div *ngIf=\"serviceRequestValue === 'false'\">\n <span class=\"heading-medium\"><br/>{{ \"Payments\" | rpxTranslate }}</span>\n <ng-container >\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header col-14\" scope=\"col\">{{ \"Status\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-10\" scope=\"col\">{{ \"Amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-17\" scope=\"col\">{{ \"Date\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-24\" scope=\"col\">{{ \"Payment reference\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-13\" scope=\"col\"></td>\n <td class=\"govuk-table__header\" scope=\"col\"></td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\" *ngIf=\"allPayments?.length > 0\">\n <tr class=\"govuk-table__row\" *ngFor=\"let payment of allPayments\">\n <td class=\"govuk-table__cell whitespace-inherit\">{{ payment.status | rpxTranslate }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ payment.amount | currency :'GBP':'symbol':'1.2-2' }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ payment.date_created | date:'dd MMM yyyy' }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ payment?.reference }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\"></td>\n <td class=\"govuk-table__cell whitespace-inherit\">\n <a href=\"javascript:void(0)\" (click)=\"goToPayementView(payment.paymentGroupReference, payment.reference, payment.method)\">{{ \"Review\" | rpxTranslate }}</a>\n </td>\n </tr>\n </tbody>\n\n <tbody class=\"govuk-table__body\" *ngIf=\"allPayments?.length === 0\">\n <td colspan=\"6\">{{ \"No payments recorded\" | rpxTranslate }}</td>\n </tbody>\n </table>\n <ccpay-app-unprocessed-payments class=\"govuk-table\"\n *ngIf=\"isBulkScanEnable && !takePayment\"\n [IS_BUTTON_ENABLE]=\"takePayment\"\n [LEVEL]=\"4\"\n [ISTURNOFF]=\"isTurnOff\"\n [ISSFENABLE]=\"isStrategicFixEnable\"\n [PAYMENTSLENGTH]=\"allPayments?.length\"\n [PAYMENTREF]=\"paymentRef\"\n (getUnprocessedFeeCount) = \"getUnprocessedFeeCount($event)\"\n [FEE_RECORDS_EXISTS]=\"isAnyFeeGroupAvilable\"\n [IS_OS_AMT_AVAILABLE]=\"isGrpOutstandingAmtPositive\"\n [CCD_CASE_NUMBER]=\"ccdCaseNumber\"\n [SELECTED_OPTION]=\"selectedOption\"\n [DCN_NUMBER]=\"dcnNumber\"\n [ISBSENABLE]=\"isBulkScanEnable\"\n [CASETYPE]=\"caseType\"\n (selectedUnprocessedFeeEvent) = \"selectedUnprocessedFeeEvent($event)\"\n (setBspaymentdcn) = \"setBspaymentdcn($event)\"\n (setViewName) = \"setViewName($event)\"\n (setUnProcessedPaymentServiceId) = \"setUnProcessedPaymentServiceId($event)\"\n (setPaymentGroupReference) = \"setPaymentGroupReference($event)\">\n </ccpay-app-unprocessed-payments>\n </ng-container>\n\n </div>\n </div>\n <div class=\"govuk-grid-column-full\" *ngIf=\"!check4AllowedRoles2AccessPBApayment()\">\n <span class=\"heading-medium\"><br/>Refunds</span>\n <ccpay-refund-status\n [ccdCaseNumber]=\"ccdCaseNumber\"\n [orderParty] =\"orderParty\"\n [LOGGEDINUSERROLES]=\"LOGGEDINUSERROLES\"\n ></ccpay-refund-status>\n </div>\n\n </ng-container>\n\n\n<input #myInput type='hidden' class='iFrameDrivenImageValue' value='FEEREMOVALCONFIRMATION_2'>\n\n<!-- Order Full View Details-->\n<ng-container *ngIf=\"viewStatus === 'order-full-view'\">\n <ccpay-service-request\n [viewStatus] = \"viewStatus\"\n [orderRef] = \"orderRef\"\n [orderStatus] = \"orderStatus\"\n [orderCreated] = \"orderCreated\"\n [orderParty] = \"orderParty\"\n [orderCCDEvent] = \"orderCCDEvent\"\n [orderDetail] = \"orderDetail\"\n [paymentGroupList] = \"paymentGroups\"\n [LOGGEDINUSERROLES] = \"LOGGEDINUSERROLES\"\n [ccdCaseNumber] = \"ccdCaseNumber\"\n [orderFeesTotal] = \"orderFeesTotal\"\n [orderTotalPayments] = \"orderTotalPayments\"\n [orderRemissionTotal] = \"orderRemissionTotal\"\n [isServiceRequest] = \"serviceRequestValue\"\n (goToServiceRquestComponent) = \"goToServiceRequestPage()\"\n ></ccpay-service-request>\n\n</ng-container>\n<ccpay-add-remission *ngIf=\"viewStatus === 'addremission' && feeId\"\n[isTurnOff]=\"isTurnOff\"\n[isStrategicFixEnable]=\"isStrategicFixEnable\"\n[viewCompStatus]= \"viewStatus\"\n[fee]=\"feeId\"\n[orderStatus] =\"orderStatus\"\n[paidAmount]= \"orderTotalPayments\"\n[isRefundRemission]=\"isRefundRemission\"\n[caseType]=\"caseType\"\n[paymentGroupRef]=\"orderRef\"\n[isFromServiceRequestPage] = \"true\"\n[payment] = \"payment\"\n[ccdCaseNumber]=\"ccdCaseNumber\"></ccpay-add-remission>\n\n<ccpay-add-remission *ngIf=\"viewStatus === 'issuerefund' && payment\"\n[isTurnOff]=\"isTurnOff\"\n[isStrategicFixEnable]=\"isStrategicFixEnable\"\n[viewCompStatus]= \"viewStatus\"\n[isFromServiceRequestPage] = \"true\"\n[payment]=\"payment\"\n[orderStatus] =\"orderStatus\"\n[paidAmount]= \"orderTotalPayments\"\n[isRefundRemission]=\"isRefundRemission\"\n[caseType]=\"caseType\"\n[paymentGroupRef]=\"orderRef\"\n[ccdCaseNumber]=\"ccdCaseNumber\"></ccpay-add-remission>\n<ccpay-add-remission *ngIf=\"viewStatus === 'addrefundforremission' && payment\"\n[isTurnOff]=\"isTurnOff\"\n[isStrategicFixEnable]=\"isStrategicFixEnable\"\n[viewCompStatus]= \"viewStatus\"\n[payment]=\"payment\"\n[orderStatus] =\"orderStatus\"\n[paidAmount]= \"orderTotalPayments\"\n[isRefundRemission]=\"isRefundRemission\"\n[caseType]=\"caseType\"\n[feeamount]=\"remissionFeeAmt\"\n[remission] = \"remissions\"\n[isFromServiceRequestPage]=\"true\"\n[ccdCaseNumber]=\"ccdCaseNumber\"></ccpay-add-remission>\n\n<ng-container *ngIf=\"viewStatus === 'feeRemovalConfirmation'\">\n <div class=\"govuk-warning-text\">\n <span class=\"govuk-warning-text__icon\" aria-hidden=\"true\">!</span>\n <strong class=\"govuk-warning-text__text\">\n <span class=\"govuk-warning-text__assistive\">Warning</span>\n Are you sure you want to delete this fee?\n </strong>\n </div>\n <div class=\"govuk-button-grb\">\n <form novalidate>\n <button type=\"submit\" class=\"button govuk-button--secondary\" (click)=\"cancelRemoval()\">\n Cancel\n </button>\n <button type=\"submit\" class=\"button\"\n [disabled]=\"isRemoveBtnDisabled\"\n [ngClass]='isRemoveBtnDisabled ? \"button button--disabled govuk-!-margin-right-1\" : \"button govuk-!-margin-right-1\"'\n (click)=\"removeFee(feeId)\">\n Remove\n </button>\n </form>\n </div>\n</ng-container>\n</main>\n</div>\n<!-- </main> -->\n<!-- </div class=\"govuk-width-container\"> -->\n", styles: [".govuk-grid-column-full--gr{position:relative;margin-bottom:10px}.disable{text-decoration:none;cursor:default;color:#fff;background-color:gray;pointer-events:none}.govuk-grid__surplus-payments{margin:20px 0}.govuk-grid__surplus-payments>.govuk-grid-column-full{padding:0}.govuk-grid__surplus-payments-col1{margin-bottom:10px}.govuk-inset-text__no-border{border-left:0px}.govuk-hidetext{font-size:22px;padding-bottom:10px}.lowercase{text-transform:lowercase}.channel:first-letter{text-transform:uppercase}.govuk-heading-xl{font-size:48px;margin-bottom:1px}.govuk-section-break--visible{border-bottom:2px solid black}.totalpayments.govuk-table__row{border-bottom:2px solid black!important}.govuk-inset-text{margin-left:1em}.govuk-button{font-size:19px;margin-bottom:0!important}.groupamount.govuk-table__header,.govuk-table__cell.govuk-table__cell--col6.govuk-table__custom--col6{text-align:right}.feeclass{padding-left:.7em}.align-center{text-align:center}details summary{display:list-item}.case-transaction__color{color:#a71414;font-weight:700;text-align:center}.capitalize:first-letter{text-transform:uppercase}.govuk-inset-text__no-left-margin{margin-left:0;padding-left:0}.whitespace-inherit{white-space:inherit!important}.govuk-section-records-break{margin:10px;border-bottom:2px solid black!important}.exisitng-fees{margin-left:12px}.add-telephony-payment{margin-top:-2em;margin-left:-2em}.govuk-table__header--custom{text-align:center}.disable-link{cursor:default;pointer-events:none;color:#8e8c8c}.panel-no--style{border-left-style:none}.col-28{width:28%!important}.col-8{width:8%!important}.col-60{width:60%!important}.col-32{width:32%!important}.col-34{width:34%!important}.col-15{width:15%!important;padding-right:0!important;padding-left:0!important}.col-16{width:16%!important}.col-14{width:14%!important}.col-17{width:17%!important}.col-12{width:12%!important}.col-9{width:9%!important}.col-10{width:10%!important}.col-11{width:11%!important}.col-13{width:13%!important}.col-21{width:21%!important}.col-20{width:20%!important}.col-24{width:24%!important}.govuk-table__cell,.govuk-table__header{padding:10px 10px 10px 0}.col-27{width:27%!important}td{white-space:nowrap;overflow:hidden!important}.col-19{width:19%!important;padding-left:0!important}.col-18{width:18%!important;padding-left:0!important;padding-right:0!important}.col-37{width:37%!important}.col-55{width:55%!important}.govuk-table{margin-bottom:1px}.hmcts-banner>.hmcts-banner__message{font-size:19px;line-height:1.25}.summary-table-font{font-size:36px}.order-class{padding-top:3em}.govuk-table__header:last-child{text-align:right}.govuk-table__cell:last-child{text-align:right}.govuk-grid-column-two-thirds{width:64%!important;padding:0!important}.govuk-heading-l{font-size:36px;margin-bottom:10px}.govuk-heading-lw{width:70%}.paymentrequest{margin-top:1em}.mar-17{margin-left:17px}.col-61{width:61px!important;padding:0!important}.error{width:960px;margin:auto}.summarypage{padding-left:36em;margin-top:2em}.summarypagealign{width:100%;text-align:right;margin-top:2em}.govuk-inset-text{font-size:2.1875rem}table{table-layout:fixed;width:100%}th,td{word-wrap:break-word}.totalPay{padding-right:14px;float:right;margin-top:2em}.govuk-back-link{font-size:1.5rem!important}.totalfees{float:right;margin-top:2em}.refundBtn{text-align:right;width:18%}.col-25{width:25%!important}.of-visible{overflow:visible!important}.col-51{width:51%!important}.alignright{text-align:right}.alignleft{text-align:left}.alignself{align-self:flex-end}.maxwidth{width:100%}.govuk-padding-btm{padding-bottom:50px}.govuk-margin-btm-20px{margin-bottom:20px}\n"], dependencies: [{ kind: "ngmodule", type: i0.forwardRef(() => CommonModule) }, { kind: "directive", type: i0.forwardRef(() => i3.NgClass), selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i0.forwardRef(() => i3.NgForOf), selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i0.forwardRef(() => i3.NgIf), selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i0.forwardRef(() => ServiceRequestComponent), selector: "ccpay-service-request", inputs: ["LOGGEDINUSERROLES", "viewStatus", "orderDetail", "orderRef", "orderStatus", "orderParty", "orderCreated", "orderCCDEvent", "orderFeesTotal", "orderTotalPayments", "orderRemissionTotal", "paymentGroupList", "takePayment", "ccdCaseNumber", "isServiceRequest"], outputs: ["goToServiceRquestComponent"] }, { kind: "component", type: i0.forwardRef(() => UnprocessedPaymentsComponent), selector: "ccpay-app-unprocessed-payments", inputs: ["FEE_RECORDS_EXISTS", "PAYMENTREF", "ISTURNOFF", "IS_BUTTON_ENABLE", "IS_OS_AMT_AVAILABLE", "ISSFENABLE", "PAYMENTSLENGTH", "LEVEL", "CCD_CASE_NUMBER", "SELECTED_OPTION", "DCN_NUMBER", "ISBSENABLE", "CASETYPE"], outputs: ["selectedUnprocessedFeeEvent", "getUnprocessedFeeCount", "setBspaymentdcn", "setViewName", "setUnProcessedPaymentServiceId", "setPaymentGroupReference"] }, { kind: "component", type: i0.forwardRef(() => AddRemissionComponent), selector: "ccpay-add-remission", inputs: ["fee", "fees", "payment", "remission", "ccdCaseNumber", "caseType", "viewCompStatus", "paymentGroupRef", "isTurnOff", "isRefundRemission", "isStrategicFixEnable", "paidAmount", "isFromRefundListPage", "isFromPaymentDetailPage", "isFromServiceRequestPage", "isFullyRefund", "feeamount", "refundPaymentReference", "isFromRefundStatusPage", "changeRefundReason", "isServiceRequest", "LOGGEDINUSERROLES", "orderDetail", "orderRef", "orderStatus", "orderParty", "orderCreated", "orderCCDEvent", "takepayment", "orderFeesTotal", "orderTotalPayments", "orderRemissionTotal"], outputs: ["cancelRemission", "refundListReason", "refundListAmount", "refundFees"] }, { kind: "component", type: i0.forwardRef(() => RefundStatusComponent), selector: "ccpay-refund-status", inputs: ["LOGGEDINUSERROLES", "API_ROOT", "ccdCaseNumber", "isTurnOff", "orderParty"] }, { kind: "ngmodule", type: i0.forwardRef(() => FormsModule) }, { kind: "directive", type: i0.forwardRef(() => i1$1.ɵNgNoValidate), selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i0.forwardRef(() => i1$1.NgControlStatusGroup), selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i0.forwardRef(() => i1$1.NgForm), selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: i0.forwardRef(() => RpxTranslationModule) }, { kind: "pipe", type: i0.forwardRef(() => i3.LowerCasePipe), name: "lowercase" }, { kind: "pipe", type: i0.forwardRef(() => i3.CurrencyPipe), name: "currency" }, { kind: "pipe", type: i0.forwardRef(() => i3.DatePipe), name: "date" }, { kind: "pipe", type: i0.forwardRef(() => CcdHyphensPipe), name: "ccdHyphens" }, { kind: "pipe", type: i0.forwardRef(() => i8.RpxTranslatePipe), name: "rpxTranslate" }] });
2914
2922
  }
2915
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: CaseTransactionsComponent, decorators: [{
2923
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: CaseTransactionsComponent, decorators: [{
2916
2924
  type: Component,
2917
2925
  args: [{ selector: 'ccpay-case-transactions', imports: [
2918
2926
  CommonModule,
@@ -3363,10 +3371,10 @@ class ServiceRequestComponent {
3363
3371
  hasPaymentsRole() {
3364
3372
  return this.LOGGEDINUSERROLES.includes('payments');
3365
3373
  }
3366
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: ServiceRequestComponent, deps: [{ token: 'PAYMENT_LIB' }, { token: PaymentViewService }, { token: OrderslistService }, { token: NotificationService }, { token: i0.ChangeDetectorRef }, { token: i1$2.Router }], target: i0.ɵɵFactoryTarget.Component });
3367
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.1", type: ServiceRequestComponent, isStandalone: true, selector: "ccpay-service-request", inputs: { LOGGEDINUSERROLES: "LOGGEDINUSERROLES", viewStatus: "viewStatus", orderDetail: "orderDetail", orderRef: "orderRef", orderStatus: "orderStatus", orderParty: "orderParty", orderCreated: "orderCreated", orderCCDEvent: "orderCCDEvent", orderFeesTotal: "orderFeesTotal", orderTotalPayments: "orderTotalPayments", orderRemissionTotal: "orderRemissionTotal", paymentGroupList: "paymentGroupList", takePayment: "takePayment", ccdCaseNumber: "ccdCaseNumber", isServiceRequest: "isServiceRequest" }, outputs: { goToServiceRquestComponent: "goToServiceRquestComponent" }, providers: [{ provide: 'SERVICE_REQUEST', useExisting: forwardRef(() => ServiceRequestComponent) }], ngImport: i0, template: "<!-- Order Full View Details-->\n<ng-container *ngIf=\"viewStatus === 'order-full-view'\">\n <div class=\"govuk-breadcrumbs\">\n <ol class=\"govuk-breadcrumbs__list\">\n <li class=\"govuk-breadcrumbs__list-item\" *ngIf=\"isServiceRequest === 'false'\">\n <a href=\"javascript:void(0)\" (click)=\"goToCaseTransationPage($event)\" class=\"govuk-back-link\">{{ \"Back\" | rpxTranslate }}</a>\n </li>\n <li class=\"govuk-breadcrumbs__list-item\" *ngIf=\"isServiceRequest !== 'false'\">\n <a href=\"javascript:void(0)\" (click)=\"goToServiceRequestPage()\" id=\"bckLnksize\" class=\"govuk-back-link\">{{ \"Back\" | rpxTranslate }}</a>\n </li>\n </ol>\n </div>\n <div class=\"govuk-grid-column-full\">\n <div class=\"column\">\n <h1 class=\"heading-large govuk-!-margin-top-0\">{{ \"Service request\" | rpxTranslate }}</h1>\n </div>\n <table >\n <tbody>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">{{ \"Service request reference\" | rpxTranslate }}</td>\n <td>{{orderRef}}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">{{ \"Status\" | rpxTranslate }}</td>\n <td>{{ orderStatus | rpxTranslate }}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">{{ \"Date created\" | rpxTranslate }}</td>\n <td>{{orderCreated | date:'dd MMMM yyyy'}}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">{{ \"Party\" | rpxTranslate }}</td>\n <td>{{orderParty}}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">CCD {{ \"event\" | rpxTranslate }}</td>\n <td>{{ orderCCDEvent | rpxTranslate}}</td>\n </tr>\n </tbody>\n </table>\n </div>\n\n <div class=\"govuk-grid-column-full order-class\">\n <div class=\"column\">\n <table class=\"govuk-table \">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header col-51\" scope=\"col\" *ngIf=\"isServiceRequest === 'false'\">{{ \"Fee\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-51\" scope=\"col\" colspan=\"2\" *ngIf=\"isServiceRequest !== 'false'\">{{ \"Fee\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header\" scope=\"col\">{{ \"Amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header\" scope=\"col\">{{ \"Total\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header\" scope=\"col\" *ngIf=\"isServiceRequest === 'false'\"></td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\" *ngFor=\"let order of orderDetail;\">\n <tr class=\"govuk-table__row\" *ngFor=\"let fee of order.fees; let i = index;\">\n <td class=\"govuk-table__cell col-60 whitespace-inherit\" *ngIf=\"isServiceRequest === 'false'\">{{ fee.description | rpxTranslate}}</td>\n <td class=\"govuk-table__cell col-60 whitespace-inherit\" colspan=\"2\" *ngIf=\"isServiceRequest !== 'false'\">{{fee.description | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{fee.volume? fee.volume : '-'}} X {{ fee.calculated_amount/fee.volume| currency:'GBP':'symbol-narrow':'1.2-2' }}</td>\n <td class=\"govuk-table__cell\">{{ fee?.net_amount | currency:'GBP':'symbol-narrow':'1.2-2' }}</td>\n <td class=\"govuk-table__cell alignright\" *ngIf=\"isServiceRequest === 'false'\">\n <button [disabled]=\"!chkIsAddRemissionBtnEnable(fee)\" (click)=\"addRemission(fee)\" class=\"govuk-button govuk-button--secondary\">{{ \"Add remission\" | rpxTranslate }}</button>\n </td>\n\n </tr>\n </tbody>\n <tbody class=\"govuk-table__body\" *ngFor=\"let order of orderDetail;\">\n <tr class=\"govuk-table__row\" *ngIf=\"order.fees?.length === 0\" >\n <td class=\"govuk-table__cell alignleft\" colspan=\"7\">{{ \"No fees recorded\" | rpxTranslate }}</td>\n </tr>\n </tbody>\n </table>\n\n </div>\n <div class=\"maxwidth\">\n <p class=\"totalfees\">{{ \"Total fees\" | rpxTranslate }}: {{orderFeesTotal | currency:'GBP':'symbol-narrow':'1.2-2' }}</p>\n </div>\n </div>\n <!-- remissions -->\n<ng-container *ngFor=\"let order of orderDetail;\" >\n <div class=\"govuk-grid-column-full order-class\" *ngIf=\"order.remissions\">\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header col-24 whitespace-inherit\" scope=\"col\">{{ \"Help with fees or remission code\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-27 whitespace-inherit\" scope=\"col\">{{ \"Reference\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header whitespace-inherit\" scope=\"col\">{{ \"Fee\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header whitespace-inherit\" scope=\"col\">{{ \"Remission Amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header whitespace-inherit refundBtn\" scope=\"col\"></td>\n </tr>\n </thead>\n <tbody *ngIf=\"order.remissions?.length > 0\" class=\"govuk-table__body\" >\n <tr class=\"govuk-table__row\" *ngFor=\"let remission of order.remissions\">\n <td class=\"govuk-table__cell whitespace-inherit\">{{ remission?.hwf_reference }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ remission?.remission_reference }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ remission?.fee_code }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ remission?.hwf_amount | currency:'GBP':'symbol-narrow':'1.2-2'}}</td>\n <td class=\"govuk-table__cell refundBtn whitespace-inherit\" >\n <button [disabled]=\"!canItBeRefunded(remission)\" (click)=\"addRefundForRemission(order.payments[0],remission,order.fees)\" class=\"govuk-button govuk-button--secondary\"> Add refund</button>\n </td>\n <!-- <td class=\"govuk-table__cell refundBtn whitespace-inherit\" >\n\n </td> -->\n </tr>\n </tbody>\n\n\n </table>\n <div *ngIf=\"order.remissions?.length === 0\">\n <span >{{ \"No help with fees or remissions.\" | rpxTranslate }}</span>\n </div>\n <div class=\"summarypagealign\">\n <p>{{ \"Total reductions\" | rpxTranslate }}: {{orderRemissionTotal | currency:'GBP':'symbol-narrow':'1.2-2' }}</p>\n </div>\n <div class=\"summarypagealign\">\n <p class=\"summarypage\">{{ \"Total fees to pay\" | rpxTranslate }}: {{(orderFeesTotal - orderRemissionTotal) | currency:'GBP':'symbol-narrow':'1.2-2' }}</p>\n </div>\n </div>\n\n</ng-container>\n\n <!--Payments-->\n <ng-container *ngFor=\"let order of orderDetail;\" >\n <div class=\"govuk-grid-column-full\" *ngIf=\"order.payments && hasPaymentsRole()\">\n <h3 class=\"heading-medium\">{{ \"Payments\" | rpxTranslate }}</h3>\n <table class=\"govuk-table \">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header col-25\" scope=\"col\"></td>\n <td class=\"govuk-table__header\" scope=\"col\">{{ \"Date created\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header\" scope=\"col\">{{ \"Amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header\" scope=\"col\"></td>\n </tr>\n </thead>\n <tbody *ngIf=\"order.payments?.length > 0\" class=\"govuk-table__body\">\n <tr class=\"govuk-table__row\" *ngFor=\"let payment of order.payments\">\n <td class=\"govuk-table__cell whitespace-inherit\">\n <a href=\"javascript:void(0)\" (click)=\"goToPayementView(payment.paymentGroupReference, payment.reference, payment.method)\">{{ \"Review\" | rpxTranslate }}</a>\n </td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ payment?.date_created | date:'dd MMM yyyy' }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ payment?.amount | currency:'GBP':'symbol-narrow':'1.2-2' }}</td>\n <td class=\"govuk-table__cell alignright\">\n <button [disabled]=\"!chkIsIssueRefundBtnEnable(payment)\" (click)=\"issueRefund(payment)\" class=\"govuk-button govuk-button--secondary\">{{ \"Issue refund\" | rpxTranslate }}</button>\n </td>\n <!-- <td *ngIf=\"!chkIssueRefundBtnEnable(payment)\" class=\"govuk-table__cell\" style=\"text-align: right;\">\n </td> -->\n </tr>\n </tbody>\n </table>\n\n <div *ngIf=\"order.payments === undefined || order.payments === null\">\n <!-- <h3 class=\"heading-medium mar-17\">Payments</h3> -->\n <span class=\"mar-17\" >{{ \"No Payments recorded\" | rpxTranslate }}</span>\n </div>\n</div>\n</ng-container>\n <div>\n <p class=\"totalPay\">{{ \"Total fees left to pay\" | rpxTranslate }}: <b>{{((orderFeesTotal - orderRemissionTotal)- orderTotalPayments )| currency:'GBP':'symbol-narrow':'1.2-2' }}</b> </p>\n </div>\n</ng-container>\n\n<ccpay-add-remission *ngIf=\"viewStatus === 'addremission' && feeId\"\n[isTurnOff]=\"isTurnOff\"\n[isStrategicFixEnable]=\"isStrategicFixEnable\"\n[viewCompStatus]= \"viewStatus\"\n[fee]=\"feeId\"\n[orderStatus] =\"orderStatus\"\n[paidAmount]= \"orderTotalPayments\"\n[isRefundRemission]=\"isRefundRemission\"\n[caseType]=\"caseType\"\n[isServiceRequest] = \"isServiceRequest\"\n[paymentGroupRef]=\"orderRef\"\n[isFromServiceRequestPage] = \"true\"\n[payment] = \"payment\"\n[ccdCaseNumber]=\"ccdCaseNumber\"\n[orderRef] = \"orderRef\"\n[orderStatus] = \"orderStatus\"\n[orderCreated] = \"orderCreated\"\n[orderParty] = \"orderParty\"\n[orderCCDEvent] = \"orderCCDEvent\"\n[orderDetail] = \"orderDetail\"\n[LOGGEDINUSERROLES] = \"LOGGEDINUSERROLES\"\n[takepayment] = \"takePayment\"\n[orderFeesTotal] = \"orderFeesTotal\"\n[orderTotalPayments] = \"orderTotalPayments\"\n[orderRemissionTotal] = \"orderRemissionTotal\"\n></ccpay-add-remission>\n<ccpay-add-remission *ngIf=\"viewStatus === 'issuerefund' && payment\"\n[isTurnOff]=\"isTurnOff\"\n[isStrategicFixEnable]=\"isStrategicFixEnable\"\n[viewCompStatus]= \"viewStatus\"\n[isFromServiceRequestPage]=\"isFromServiceRequestPage\"\n[isFromPaymentDetailPage] = \"isFromPaymentDetailPage\"\n[payment]=\"payment\"\n[orderStatus] =\"orderStatus\"\n[paidAmount]= \"orderTotalPayments\"\n[isRefundRemission]=\"isRefundRemission\"\n[caseType]=\"caseType\"\n[paymentGroupRef]=\"orderRef\"\n[ccdCaseNumber]=\"ccdCaseNumber\"\n[orderRef] = \"orderRef\"\n[orderStatus] = \"orderStatus\"\n[orderCreated] = \"orderCreated\"\n[orderParty] = \"orderParty\"\n[orderCCDEvent] = \"orderCCDEvent\"\n[orderDetail] = \"orderDetail\"\n[isFullyRefund] = \"isFullyRefund\"\n[fees] = \"paymentFees\"\n[LOGGEDINUSERROLES] = \"LOGGEDINUSERROLES\"\n[isFromRefundListPage] = \"false\"\n[takepayment] = \"takePayment\"\n[orderFeesTotal] = \"orderFeesTotal\"\n[orderTotalPayments] = \"orderTotalPayments\"\n[orderRemissionTotal] = \"orderRemissionTotal\"></ccpay-add-remission>\n\n<ccpay-add-remission *ngIf=\"viewStatus === 'addrefundforremission' && payment\"\n[isTurnOff]=\"isTurnOff\"\n[isStrategicFixEnable]=\"isStrategicFixEnable\"\n[viewCompStatus]= \"viewStatus\"\n[payment]=\"payment\"\n[orderStatus] =\"orderStatus\"\n[paidAmount]= \"orderTotalPayments\"\n[isRefundRemission]=\"isRefundRemission\"\n[caseType]=\"caseType\"\n[feeamount]=\"remissionFeeAmt\"\n[remission] = \"remissions\"\n[isFromServiceRequestPage]=\"isServiceRequest\"\n[ccdCaseNumber]=\"ccdCaseNumber\"\n[orderRef] = \"orderRef\"\n[orderStatus] = \"orderStatus\"\n[orderCreated] = \"orderCreated\"\n[orderParty] = \"orderParty\"\n[orderCCDEvent] = \"orderCCDEvent\"\n[orderDetail] = \"orderDetail\"\n[LOGGEDINUSERROLES] = \"LOGGEDINUSERROLES\"\n[takepayment] = \"takePayment\"\n[orderFeesTotal] = \"orderFeesTotal\"\n[orderTotalPayments] = \"orderTotalPayments\"\n[orderRemissionTotal] = \"orderRemissionTotal\"></ccpay-add-remission>\n\n<ccpay-payment-view *ngIf=\"viewStatus === 'payment-view'\"\n[LOGGEDINUSERROLES] = \"LOGGEDINUSERROLES\"\n[isTurnOff] = \"isTurnOff\"\n[isTakePayment] = \"takePayment\"\n[caseType] = \"caseType\"\n[orderRef] = \"orderRef\"\n[orderStatus] = \"orderStatus\"\n[orderCreated] = \"orderCreated\"\n[orderParty] = \"orderParty\"\n[orderCCDEvent] = \"orderCCDEvent\"\n[orderDetail] = \"orderDetail\"\n[orderFeesTotal] = \"orderFeesTotal\"\n[orderTotalPayments] = \"orderTotalPayments\"\n[orderRemissionTotal] = \"orderRemissionTotal\"\n[isServiceRequest] = \"isServiceRequest\">\n</ccpay-payment-view>\n\n<ng-container *ngIf=\"viewStatus === 'feeRemovalConfirmation'\">\n<div class=\"govuk-warning-text\">\n <span class=\"govuk-warning-text__icon\" aria-hidden=\"true\">!</span>\n <strong class=\"govuk-warning-text__text\">\n <span class=\"govuk-warning-text__assistive\">{{ \"Warning\" | rpxTranslate }}</span>\n {{ \"Are you sure you want to delete this fee?\" | rpxTranslate }}\n </strong>\n</div>\n<div class=\"govuk-button-grb\">\n <form novalidate>\n <button type=\"submit\" class=\"button govuk-button--secondary\" (click)=\"cancelRemoval()\">\n {{ \"Cancel\" | rpxTranslate }}\n </button>\n <button type=\"submit\" class=\"button\"\n [disabled]=\"isRemoveBtnDisabled\"\n [ngClass]='isRemoveBtnDisabled ? \"button button--disabled govuk-!-margin-right-1\" : \"button govuk-!-margin-right-1\"'\n (click)=\"removeFee(feeId)\">\n {{ \"Remove\" | rpxTranslate }}\n </button>\n </form>\n</div>\n</ng-container>\n\n<div class=\"over-payment\">\n <ng-container *ngIf=\"viewCompStatus === 'overpayment'\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='OVERPAYMENTPAGE'>\n <h1 class=\"heading-large\">{{ \"Issue refund\" | rpxTranslate }}</h1>\n <h1 class=\"heading-medium\">{{ \"Case reference\" | rpxTranslate }}: {{ccdCaseNumber | ccdHyphens }}</h1>\n <span id=\"how-contacted-conditional-hint govuk-font19px\" class=\"form-hint\">\n {{ \"Payment reference\" | rpxTranslate }}: {{paymentGroupList?.payments[0]?.reference}}\n </span>\n <div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--l\">\n <h1 class=\"heading-medium\">{{ \"Select payment to refund\" | rpxTranslate }}</h1>\n </legend>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"over-payment\" name=\"over-payment\" type=\"radio\" (click)=\"selectPymentOption('op')\" value=\"op\">\n <label class=\"govuk-label govuk-radios__label govuk-font19px\" for=\"where-do-you-live\">\n {{ \"Over payment\" | rpxTranslate }} \u00A3{{getOverPaymentValue() | number:'.2'}}\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"full-payment\" name=\"over-payment\" type=\"radio\" (click)=\"selectPymentOption('fp')\" value=\"fp\">\n <label class=\"govuk-label govuk-radios__label govuk-font19px\" for=\"where-do-you-live-2\">\n {{ \"Full payment\" | rpxTranslate }} \u00A3{{paymentGroupList?.payments[0]?.amount | number:'.2'}}\n </label>\n </div>\n </div>\n <button class=\"govuk-button govuk-button--secondary over-payment-alignment govuk-font19px\"\n (click)=\"goToPaymentViewComp()\"> {{ \"Previous\" | rpxTranslate }}</button>\n <button\n (click)=\"continuePayment(paymentGroupList)\"\n [disabled]=\"isContinueBtnDisabled\"\n [ngClass]='isContinueBtnDisabled ? \"button button--disabled govuk-!-margin-right-1 govuk-font19px\" : \"button govuk-!-margin-right-1 govuk-font19px\"'\n class=\"govuk-button\"> {{ \"Continue\" | rpxTranslate }}</button>\n </fieldset>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"viewCompStatus === 'overPaymentAddressCapture'\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='OVERPAYMENTADDRESSCAPTUREPAGE'>\n <h1 class=\"govuk-heading-l\">{{ \"Issue refund\" | rpxTranslate }}</h1>\n <h2 class=\"govuk-heading-m govuk-font19px\">{{ \"Case reference\" | rpxTranslate }}: {{ccdCaseNumber | ccdHyphens }}</h2>\n <span id=\"how-contacted-conditional-hint\" class=\"govuk-hint govuk-font19px\">\n {{ \"Payment reference\" | rpxTranslate }}: {{paymentGroupList?.payments[0]?.reference}}\n </span>\n <ccpay-contact-details\n [addressObj] = notification\n (assignContactDetails)=\"getContactDetails($event)\"\n (redirectToIssueRefund)=\"gotoPaymentSelectPage($event)\" ></ccpay-contact-details>\n <p>\n <a (click)=\"goToCaseTransationPage($event)\" class=\"govuk-link\" data-module=\"govuk-button\">\n {{ \"Cancel\" | rpxTranslate }}\n </a>\n </p>\n </ng-container>\n\n <ng-container *ngIf=\"viewCompStatus === 'overpaymentcheckandanswer'\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='ADDREFUNDFORREMISSION'>\n <div class=\"govuk-warning-text\">\n\n <h1 class=\"heading-large\"> {{ \"Check your answers\" | rpxTranslate }}</h1>\n </div>\n <table class=\"govuk-table govuk-table-mb\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Payment reference\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{paymentGroupList.payments[0].reference}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Payment amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{paymentGroupList.payments[0].amount | currency:'GBP':'symbol-narrow':'1.2-2'}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Fee amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{paymentGroupList?.fees[0]?.net_amount | currency:'GBP':'symbol-narrow':'1.2-2'}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Refund amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{getOverPaymentValue() | currency:'GBP':'symbol-narrow':'1.2-2'}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Refund reason\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{ \"Over payment\" | rpxTranslate }}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Send to\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{orderParty}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Send via\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">\n <div *ngIf=\"contactDetailsObj?.notification_type === 'EMAIL'\" class=\"contactDetails-width\">\n <strong>Email</strong>\n <br/>\n {{contactDetailsObj?.email?.trim()}}\n </div>\n <div *ngIf=\"contactDetailsObj?.notification_type === 'LETTER'\" class=\"contactDetails-width\">\n <strong>Post</strong>\n <br/>\n {{contactDetailsObj?.address_line?.trim()}}&nbsp;{{contactDetailsObj?.city?.trim()}}&nbsp;{{contactDetailsObj?.county?.trim()}}&nbsp;{{contactDetailsObj?.country?.trim()}}&nbsp;{{contactDetailsObj?.postal_code?.trim()}}\n </div>\n <a (click)=\"gotoAddressPage(contactDetailsObj)\" class=\"govuk-link right\" >Change</a>\n </td>\n </tr>\n\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">Notification</td>\n <td class=\"govuk-table__cell\">{{templateInstructionType}}\n <a *ngIf=\"!notificationPreview\" href=\"Javascript:void(0)\" class=\"govuk-link right\" (click)=\"showNotificationPreview()\">\n Preview\n </a>\n <a *ngIf=\"notificationPreview\" href=\"Javascript:void(0)\" class=\"govuk-link right\" (click)=\"hideNotificationPreview()\">\n Hide Preview\n </a>\n </td>\n </tr>\n </table>\n\n <app-notification-preview *ngIf=\"notificationPreview\"\n [payment]=\"paymentGroupList.payments[0]\"\n [contactDetails]=\"contactDetailsObj\"\n [refundReason]=\"'RR037'\"\n [refundAmount]=\"getOverPaymentValue()\"></app-notification-preview>\n\n\n <button type=\"submit\" class=\"button govuk-button--secondary over-payment-alignment govuk-font19px\" (click)=\"gotoAddressPage(contactDetailsObj)\">Previous</button>\n <button type=\"submit\"\n [ngClass]='isContinueBtnDisabled ? \"button button--disabled govuk-!-margin-right-1 govuk-font19px\" : \"button govuk-!-margin-right-1 govuk-font19px\"'\n (click)=\"processRefund()\">\n Submit refund\n </button>\n <p>\n <a href=\"javascript:void(0)\" (click)=\"goToCaseTransationPage($event)\" class=\"govuk-link govuk-font19px\" data-module=\"govuk-button\">\n Cancel\n </a>\n </p>\n\n </ng-container>\n <ng-container *ngIf=\"viewStatus === 'refundconfirmationpage' && viewCompStatus !== 'overpayment' && viewCompStatus !== 'overPaymentAddressCapture' && viewCompStatus !== 'overpaymentcheckandanswer'\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='RETROREMISSIONREFUNDCONFIRMATIONPAGE'>\n <div class=\"govuk-grid-row pagesize\">\n <div >\n <div class=\"govuk-panel govuk-panel--confirmation\">\n <h1 class=\"govuk-panel_service_request_title\">\n Refund submitted\n </h1>\n\n <div class=\"govuk-panel__body\">\n <p class=\"govuk-body white\"><strong class=\"white\">Refund reference: {{refundReference}}</strong></p>\n </div>\n\n </div>\n <h2 class=\"govuk-heading-l\">What happens next</h2>\n <p class=\"govuk-body\">\n A refund request for {{refundAmount | currency:'GBP':'symbol-narrow':'1.2-2' }} has been created and will be passed to a team leader to approve.\n </p>\n <p class=\"govuk-body\">\n <a href=\"javascript:void(0)\" (click)=\"goToCaseTransationPage($event)\" class=\"govuk-link pointer\" data-module=\"govuk-button\">\n Return to case\n </a>\n </p>\n </div>\n </div>\n\n </ng-container>\n </div>\n\n<ccpay-case-transactions *ngIf=\"viewStatus === 'case-transactions'\"\n[isFromServiceRequestPage]=\"isServiceRequest\"\n[LOGGEDINUSERROLES] = \"LOGGEDINUSERROLES\"\n[isTakePayment] = \"takePayment\">\n</ccpay-case-transactions>\n", styles: [".govuk-grid-column-full--gr{position:relative;margin-bottom:10px}.hmcts-currency-input__symbol{font-family:nta,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px;line-height:initial;position:absolute;font-weight:200;padding:8px 10px;height:40px;box-sizing:border-box;background-color:#dee0e2;border:2px solid #0b0c0c}.disable{text-decoration:none;cursor:default;color:#fff;background-color:gray;pointer-events:none}.pagesize{margin:2em;width:97%}.govuk-grid__surplus-payments{margin:20px 0}.govuk-grid__surplus-payments>.govuk-grid-column-full{padding:0}.govuk-grid__surplus-payments-col1{margin-bottom:10px}.govuk-inset-text__no-border{border-left:0px}.govuk-hidetext{font-size:22px;padding-bottom:10px}.lowercase{text-transform:lowercase}.channel:first-letter{text-transform:uppercase}.govuk-heading-xl{font-size:48px;margin-bottom:1px}.govuk-section-break--visible{border-bottom:2px solid black}.totalpayments.govuk-table__row{border-bottom:2px solid black!important}.govuk-inset-text{margin-left:1em}.govuk-button{font-size:19px;margin-bottom:0!important}.govuk-panel_service_request_title{margin-top:0;margin-bottom:30px;color:#fff;font-family:nta,Arial,sans-serif;-webkit-font-smoothing:antialiased;font-weight:700;font-size:48px}.groupamount.govuk-table__header,.govuk-table__cell.govuk-table__cell--col6.govuk-table__custom--col6{text-align:right}.feeclass{padding-left:.7em}.align-center{text-align:center}details summary{display:list-item}.case-transaction__color{color:#a71414;font-weight:700;text-align:center}.capitalize:first-letter{text-transform:uppercase}.govuk-inset-text__no-left-margin{margin-left:0;padding-left:0}.whitespace-inherit{white-space:inherit!important}.govuk-section-records-break{margin:10px;border-bottom:2px solid black!important}.exisitng-fees{margin-left:12px}.add-telephony-payment{margin-top:-2em;margin-left:-2em}.govuk-table__header--custom{text-align:center}.disable-link{cursor:default;pointer-events:none;color:#8e8c8c}.panel-no--style{border-left-style:none}.col-28{width:28%!important}.col-8{width:8%!important}.col-60{width:60%!important}.col-32{width:32%!important}.col-34{width:34%!important}#bckLnksize{font-size:16px!important}.col-15{width:15%!important;padding-right:0!important;padding-left:0!important}.col-16{width:16%!important}.col-14{width:14%!important}.col-17{width:17%!important}.col-12{width:12%!important}.col-9{width:9%!important}.col-10{width:10%!important}.col-11{width:11%!important}.col-13{width:13%!important}.col-21{width:21%!important}.col-20{width:20%!important}.col-24{width:24%!important}.govuk-table__cell,.govuk-table__header{padding:10px 10px 10px 0}.col-27{width:27%!important}td{white-space:nowrap;overflow:hidden!important}.col-19{width:19%!important;padding-left:0!important}.col-18{width:18%!important;padding-left:0!important;padding-right:0!important}.col-37{width:37%!important}.col-55{width:55%!important}.govuk-table{margin-bottom:1px}.hmcts-banner>.hmcts-banner__message{font-size:19px;line-height:1.25}.summary-table-font{font-size:36px}.order-class{padding-top:3em}.govuk-table__header:last-child{text-align:right}.govuk-table__cell:last-child{text-align:right}.govuk-grid-column-two-thirds{width:64%!important;padding:0!important}.govuk-heading-l{font-size:36px;margin-bottom:10px}.paymentrequest{margin-top:1em}.mar-17{margin-left:17px}.col-61{width:61px!important;padding:0!important}.error{width:960px;margin:auto}.summarypage{padding-left:36em;margin-top:2em}.summarypagealign{width:100%;text-align:right;margin-top:2em}.govuk-inset-text{font-size:2.1875rem}table{table-layout:fixed;width:100%}th,td{word-wrap:break-word}.totalPay{padding-right:14px;float:right;margin-top:2em}.govuk-back-link{font-size:1.5rem!important}.totalfees{float:right;margin-top:2em}.refundBtn{text-align:right;width:18%}.col-25{width:25%!important}.col-51{width:51%!important}.alignright{text-align:right}.alignleft{text-align:left}.alignself{align-self:flex-end}.maxwidth{width:100%}.over-payment .govuk-table-mb{margin-bottom:20px}.over-payment .contactDetails-width{width:70%}.over-payment .margin-top10px{margin-top:20px}.over-payment .govuk-font19px{font-size:19px!important}.over-payment .margin-top--size{margin-top:-30px}.over-payment .over-payment-alignment{margin-right:10px}.over-payment .govuk-button{font-size:19px;float:left;margin-top:2em}.over-payment td.govuk-table__cell{width:50%;text-align:left}.over-payment .govuk-warning-text__text,.over-payment .govuk-label--s,.over-payment .service-label__symbol{font-size:19px;font-weight:400}.over-payment .inline-error-class{outline:3px solid #a71414;outline-offset:0;border-color:#a71414}.over-payment .inline-error-message{color:#a71414;border-color:#a71414;font-weight:700;margin-top:10px;font-size:20px}.over-payment .govuk-button-group{padding-top:2em}.over-payment .heading-medium{margin-top:.875em}.over-payment .heading-large{margin-top:.25em}.over-payment .govuk-panel--confirmation{color:#fff;background:#00703c}.over-payment .govuk-panel__title{font-size:5rem}.over-payment .govuk-body-m,.over-payment .govuk-body{font-size:2.1875rem}.over-payment .govuk-link{cursor:pointer}.over-payment .govuk-radios__conditional{padding-top:12px!important}.over-payment .right{float:right;cursor:pointer}.over-payment .radio{float:right}.over-payment .white{color:#fff}\n"], dependencies: [{ kind: "component", type: i0.forwardRef(() => AddRemissionComponent), selector: "ccpay-add-remission", inputs: ["fee", "fees", "payment", "remission", "ccdCaseNumber", "caseType", "viewCompStatus", "paymentGroupRef", "isTurnOff", "isRefundRemission", "isStrategicFixEnable", "paidAmount", "isFromRefundListPage", "isFromPaymentDetailPage", "isFromServiceRequestPage", "isFullyRefund", "feeamount", "refundPaymentReference", "isFromRefundStatusPage", "changeRefundReason", "isServiceRequest", "LOGGEDINUSERROLES", "orderDetail", "orderRef", "orderStatus", "orderParty", "orderCreated", "orderCCDEvent", "takepayment", "orderFeesTotal", "orderTotalPayments", "orderRemissionTotal"], outputs: ["cancelRemission", "refundListReason", "refundListAmount", "refundFees"] }, { kind: "ngmodule", type: i0.forwardRef(() => CommonModule) }, { kind: "directive", type: i0.forwardRef(() => i3.NgClass), selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i0.forwardRef(() => i3.NgForOf), selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i0.forwardRef(() => i3.NgIf), selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i0.forwardRef(() => PaymentViewComponent), selector: "ccpay-payment-view", inputs: ["isTurnOff", "isTakePayment", "caseType", "orderRef", "orderStatus", "orderTotalPayments", "payment", "LOGGEDINUSERROLES", "ISPAYMENTSTATUSENABLED", "orderParty", "orderCreated", "orderCCDEvent", "orderFeesTotal", "orderRemissionTotal", "orderDetail", "isServiceRequest"] }, { kind: "component", type: i0.forwardRef(() => ContactDetailsComponent), selector: "ccpay-contact-details", inputs: ["isEditOperation", "isEditOperationInRefundList", "addressObj"], outputs: ["assignContactDetails", "assignContactDetailsInFefundsList", "redirectToIssueRefund"] }, { kind: "component", type: i0.forwardRef(() => NotificationPreviewComponent), selector: "app-notification-preview", inputs: ["payment", "contactDetails", "refundReason", "refundAmount", "paymentReference", "refundReference", "previewJourney", "notificationSent"], outputs: ["notificationPreviewEvent"] }, { kind: "component", type: i0.forwardRef(() => CaseTransactionsComponent), selector: "ccpay-case-transactions", inputs: ["LOGGEDINUSERROLES", "isTakePayment", "isFromServiceRequestPage"] }, { kind: "ngmodule", type: i0.forwardRef(() => RpxTranslationModule) }, { kind: "pipe", type: i0.forwardRef(() => i3.DecimalPipe), name: "number" }, { kind: "pipe", type: i0.forwardRef(() => i3.CurrencyPipe), name: "currency" }, { kind: "pipe", type: i0.forwardRef(() => i3.DatePipe), name: "date" }, { kind: "pipe", type: i0.forwardRef(() => CcdHyphensPipe), name: "ccdHyphens" }, { kind: "pipe", type: i0.forwardRef(() => i8.RpxTranslatePipe), name: "rpxTranslate" }] });
3374
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: ServiceRequestComponent, deps: [{ token: 'PAYMENT_LIB' }, { token: PaymentViewService }, { token: OrderslistService }, { token: NotificationService }, { token: i0.ChangeDetectorRef }, { token: i1$2.Router }], target: i0.ɵɵFactoryTarget.Component });
3375
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: ServiceRequestComponent, isStandalone: true, selector: "ccpay-service-request", inputs: { LOGGEDINUSERROLES: "LOGGEDINUSERROLES", viewStatus: "viewStatus", orderDetail: "orderDetail", orderRef: "orderRef", orderStatus: "orderStatus", orderParty: "orderParty", orderCreated: "orderCreated", orderCCDEvent: "orderCCDEvent", orderFeesTotal: "orderFeesTotal", orderTotalPayments: "orderTotalPayments", orderRemissionTotal: "orderRemissionTotal", paymentGroupList: "paymentGroupList", takePayment: "takePayment", ccdCaseNumber: "ccdCaseNumber", isServiceRequest: "isServiceRequest" }, outputs: { goToServiceRquestComponent: "goToServiceRquestComponent" }, providers: [{ provide: 'SERVICE_REQUEST', useExisting: forwardRef(() => ServiceRequestComponent) }], ngImport: i0, template: "<!-- Order Full View Details-->\n<ng-container *ngIf=\"viewStatus === 'order-full-view'\">\n <div class=\"govuk-breadcrumbs\">\n <ol class=\"govuk-breadcrumbs__list\">\n <li class=\"govuk-breadcrumbs__list-item\" *ngIf=\"isServiceRequest === 'false'\">\n <a href=\"javascript:void(0)\" (click)=\"goToCaseTransationPage($event)\" class=\"govuk-back-link\">{{ \"Back\" | rpxTranslate }}</a>\n </li>\n <li class=\"govuk-breadcrumbs__list-item\" *ngIf=\"isServiceRequest !== 'false'\">\n <a href=\"javascript:void(0)\" (click)=\"goToServiceRequestPage()\" id=\"bckLnksize\" class=\"govuk-back-link\">{{ \"Back\" | rpxTranslate }}</a>\n </li>\n </ol>\n </div>\n <div class=\"govuk-grid-column-full\">\n <div class=\"column\">\n <h1 class=\"heading-large govuk-!-margin-top-0\">{{ \"Service request\" | rpxTranslate }}</h1>\n </div>\n <table >\n <tbody>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">{{ \"Service request reference\" | rpxTranslate }}</td>\n <td>{{orderRef}}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">{{ \"Status\" | rpxTranslate }}</td>\n <td>{{ orderStatus | rpxTranslate }}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">{{ \"Date created\" | rpxTranslate }}</td>\n <td>{{orderCreated | date:'dd MMMM yyyy'}}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">{{ \"Party\" | rpxTranslate }}</td>\n <td>{{orderParty}}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">CCD {{ \"event\" | rpxTranslate }}</td>\n <td>{{ orderCCDEvent | rpxTranslate}}</td>\n </tr>\n </tbody>\n </table>\n </div>\n\n <div class=\"govuk-grid-column-full order-class\">\n <div class=\"column\">\n <table class=\"govuk-table \">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header col-51\" scope=\"col\" *ngIf=\"isServiceRequest === 'false'\">{{ \"Fee\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-51\" scope=\"col\" colspan=\"2\" *ngIf=\"isServiceRequest !== 'false'\">{{ \"Fee\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header\" scope=\"col\">{{ \"Amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header\" scope=\"col\">{{ \"Total\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header\" scope=\"col\" *ngIf=\"isServiceRequest === 'false'\"></td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\" *ngFor=\"let order of orderDetail;\">\n <tr class=\"govuk-table__row\" *ngFor=\"let fee of order.fees; let i = index;\">\n <td class=\"govuk-table__cell col-60 whitespace-inherit\" *ngIf=\"isServiceRequest === 'false'\">{{ fee.description | rpxTranslate}}</td>\n <td class=\"govuk-table__cell col-60 whitespace-inherit\" colspan=\"2\" *ngIf=\"isServiceRequest !== 'false'\">{{fee.description | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{fee.volume? fee.volume : '-'}} X {{ fee.calculated_amount/fee.volume| currency:'GBP':'symbol-narrow':'1.2-2' }}</td>\n <td class=\"govuk-table__cell\">{{ fee?.net_amount | currency:'GBP':'symbol-narrow':'1.2-2' }}</td>\n <td class=\"govuk-table__cell alignright\" *ngIf=\"isServiceRequest === 'false'\">\n <button [disabled]=\"!chkIsAddRemissionBtnEnable(fee)\" (click)=\"addRemission(fee)\" class=\"govuk-button govuk-button--secondary\">{{ \"Add remission\" | rpxTranslate }}</button>\n </td>\n\n </tr>\n </tbody>\n <tbody class=\"govuk-table__body\" *ngFor=\"let order of orderDetail;\">\n <tr class=\"govuk-table__row\" *ngIf=\"order.fees?.length === 0\" >\n <td class=\"govuk-table__cell alignleft\" colspan=\"7\">{{ \"No fees recorded\" | rpxTranslate }}</td>\n </tr>\n </tbody>\n </table>\n\n </div>\n <div class=\"maxwidth\">\n <p class=\"totalfees\">{{ \"Total fees\" | rpxTranslate }}: {{orderFeesTotal | currency:'GBP':'symbol-narrow':'1.2-2' }}</p>\n </div>\n </div>\n <!-- remissions -->\n<ng-container *ngFor=\"let order of orderDetail;\" >\n <div class=\"govuk-grid-column-full order-class\" *ngIf=\"order.remissions\">\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header col-24 whitespace-inherit\" scope=\"col\">{{ \"Help with fees or remission code\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-27 whitespace-inherit\" scope=\"col\">{{ \"Reference\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header whitespace-inherit\" scope=\"col\">{{ \"Fee\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header whitespace-inherit\" scope=\"col\">{{ \"Remission Amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header whitespace-inherit refundBtn\" scope=\"col\"></td>\n </tr>\n </thead>\n <tbody *ngIf=\"order.remissions?.length > 0\" class=\"govuk-table__body\" >\n <tr class=\"govuk-table__row\" *ngFor=\"let remission of order.remissions\">\n <td class=\"govuk-table__cell whitespace-inherit\">{{ remission?.hwf_reference }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ remission?.remission_reference }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ remission?.fee_code }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ remission?.hwf_amount | currency:'GBP':'symbol-narrow':'1.2-2'}}</td>\n <td class=\"govuk-table__cell refundBtn whitespace-inherit\" >\n <button [disabled]=\"!canItBeRefunded(remission)\" (click)=\"addRefundForRemission(order.payments[0],remission,order.fees)\" class=\"govuk-button govuk-button--secondary\"> Add refund</button>\n </td>\n <!-- <td class=\"govuk-table__cell refundBtn whitespace-inherit\" >\n\n </td> -->\n </tr>\n </tbody>\n\n\n </table>\n <div *ngIf=\"order.remissions?.length === 0\">\n <span >{{ \"No help with fees or remissions.\" | rpxTranslate }}</span>\n </div>\n <div class=\"summarypagealign\">\n <p>{{ \"Total reductions\" | rpxTranslate }}: {{orderRemissionTotal | currency:'GBP':'symbol-narrow':'1.2-2' }}</p>\n </div>\n <div class=\"summarypagealign\">\n <p class=\"summarypage\">{{ \"Total fees to pay\" | rpxTranslate }}: {{(orderFeesTotal - orderRemissionTotal) | currency:'GBP':'symbol-narrow':'1.2-2' }}</p>\n </div>\n </div>\n\n</ng-container>\n\n <!--Payments-->\n <ng-container *ngFor=\"let order of orderDetail;\" >\n <div class=\"govuk-grid-column-full\" *ngIf=\"order.payments && hasPaymentsRole()\">\n <h3 class=\"heading-medium\">{{ \"Payments\" | rpxTranslate }}</h3>\n <table class=\"govuk-table \">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header col-25\" scope=\"col\"></td>\n <td class=\"govuk-table__header\" scope=\"col\">{{ \"Date created\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header\" scope=\"col\">{{ \"Amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header\" scope=\"col\"></td>\n </tr>\n </thead>\n <tbody *ngIf=\"order.payments?.length > 0\" class=\"govuk-table__body\">\n <tr class=\"govuk-table__row\" *ngFor=\"let payment of order.payments\">\n <td class=\"govuk-table__cell whitespace-inherit\">\n <a href=\"javascript:void(0)\" (click)=\"goToPayementView(payment.paymentGroupReference, payment.reference, payment.method)\">{{ \"Review\" | rpxTranslate }}</a>\n </td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ payment?.date_created | date:'dd MMM yyyy' }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ payment?.amount | currency:'GBP':'symbol-narrow':'1.2-2' }}</td>\n <td class=\"govuk-table__cell alignright\">\n <button [disabled]=\"!chkIsIssueRefundBtnEnable(payment)\" (click)=\"issueRefund(payment)\" class=\"govuk-button govuk-button--secondary\">{{ \"Issue refund\" | rpxTranslate }}</button>\n </td>\n <!-- <td *ngIf=\"!chkIssueRefundBtnEnable(payment)\" class=\"govuk-table__cell\" style=\"text-align: right;\">\n </td> -->\n </tr>\n </tbody>\n </table>\n\n <div *ngIf=\"order.payments === undefined || order.payments === null\">\n <!-- <h3 class=\"heading-medium mar-17\">Payments</h3> -->\n <span class=\"mar-17\" >{{ \"No Payments recorded\" | rpxTranslate }}</span>\n </div>\n</div>\n</ng-container>\n <div>\n <p class=\"totalPay\">{{ \"Total fees left to pay\" | rpxTranslate }}: <b>{{((orderFeesTotal - orderRemissionTotal)- orderTotalPayments )| currency:'GBP':'symbol-narrow':'1.2-2' }}</b> </p>\n </div>\n</ng-container>\n\n<ccpay-add-remission *ngIf=\"viewStatus === 'addremission' && feeId\"\n[isTurnOff]=\"isTurnOff\"\n[isStrategicFixEnable]=\"isStrategicFixEnable\"\n[viewCompStatus]= \"viewStatus\"\n[fee]=\"feeId\"\n[orderStatus] =\"orderStatus\"\n[paidAmount]= \"orderTotalPayments\"\n[isRefundRemission]=\"isRefundRemission\"\n[caseType]=\"caseType\"\n[isServiceRequest] = \"isServiceRequest\"\n[paymentGroupRef]=\"orderRef\"\n[isFromServiceRequestPage] = \"true\"\n[payment] = \"payment\"\n[ccdCaseNumber]=\"ccdCaseNumber\"\n[orderRef] = \"orderRef\"\n[orderStatus] = \"orderStatus\"\n[orderCreated] = \"orderCreated\"\n[orderParty] = \"orderParty\"\n[orderCCDEvent] = \"orderCCDEvent\"\n[orderDetail] = \"orderDetail\"\n[LOGGEDINUSERROLES] = \"LOGGEDINUSERROLES\"\n[takepayment] = \"takePayment\"\n[orderFeesTotal] = \"orderFeesTotal\"\n[orderTotalPayments] = \"orderTotalPayments\"\n[orderRemissionTotal] = \"orderRemissionTotal\"\n></ccpay-add-remission>\n<ccpay-add-remission *ngIf=\"viewStatus === 'issuerefund' && payment\"\n[isTurnOff]=\"isTurnOff\"\n[isStrategicFixEnable]=\"isStrategicFixEnable\"\n[viewCompStatus]= \"viewStatus\"\n[isFromServiceRequestPage]=\"isFromServiceRequestPage\"\n[isFromPaymentDetailPage] = \"isFromPaymentDetailPage\"\n[payment]=\"payment\"\n[orderStatus] =\"orderStatus\"\n[paidAmount]= \"orderTotalPayments\"\n[isRefundRemission]=\"isRefundRemission\"\n[caseType]=\"caseType\"\n[paymentGroupRef]=\"orderRef\"\n[ccdCaseNumber]=\"ccdCaseNumber\"\n[orderRef] = \"orderRef\"\n[orderStatus] = \"orderStatus\"\n[orderCreated] = \"orderCreated\"\n[orderParty] = \"orderParty\"\n[orderCCDEvent] = \"orderCCDEvent\"\n[orderDetail] = \"orderDetail\"\n[isFullyRefund] = \"isFullyRefund\"\n[fees] = \"paymentFees\"\n[LOGGEDINUSERROLES] = \"LOGGEDINUSERROLES\"\n[isFromRefundListPage] = \"false\"\n[takepayment] = \"takePayment\"\n[orderFeesTotal] = \"orderFeesTotal\"\n[orderTotalPayments] = \"orderTotalPayments\"\n[orderRemissionTotal] = \"orderRemissionTotal\"></ccpay-add-remission>\n\n<ccpay-add-remission *ngIf=\"viewStatus === 'addrefundforremission' && payment\"\n[isTurnOff]=\"isTurnOff\"\n[isStrategicFixEnable]=\"isStrategicFixEnable\"\n[viewCompStatus]= \"viewStatus\"\n[payment]=\"payment\"\n[orderStatus] =\"orderStatus\"\n[paidAmount]= \"orderTotalPayments\"\n[isRefundRemission]=\"isRefundRemission\"\n[caseType]=\"caseType\"\n[feeamount]=\"remissionFeeAmt\"\n[remission] = \"remissions\"\n[isFromServiceRequestPage]=\"isServiceRequest\"\n[ccdCaseNumber]=\"ccdCaseNumber\"\n[orderRef] = \"orderRef\"\n[orderStatus] = \"orderStatus\"\n[orderCreated] = \"orderCreated\"\n[orderParty] = \"orderParty\"\n[orderCCDEvent] = \"orderCCDEvent\"\n[orderDetail] = \"orderDetail\"\n[LOGGEDINUSERROLES] = \"LOGGEDINUSERROLES\"\n[takepayment] = \"takePayment\"\n[orderFeesTotal] = \"orderFeesTotal\"\n[orderTotalPayments] = \"orderTotalPayments\"\n[orderRemissionTotal] = \"orderRemissionTotal\"></ccpay-add-remission>\n\n<ccpay-payment-view *ngIf=\"viewStatus === 'payment-view'\"\n[LOGGEDINUSERROLES] = \"LOGGEDINUSERROLES\"\n[isTurnOff] = \"isTurnOff\"\n[isTakePayment] = \"takePayment\"\n[caseType] = \"caseType\"\n[orderRef] = \"orderRef\"\n[orderStatus] = \"orderStatus\"\n[orderCreated] = \"orderCreated\"\n[orderParty] = \"orderParty\"\n[orderCCDEvent] = \"orderCCDEvent\"\n[orderDetail] = \"orderDetail\"\n[orderFeesTotal] = \"orderFeesTotal\"\n[orderTotalPayments] = \"orderTotalPayments\"\n[orderRemissionTotal] = \"orderRemissionTotal\"\n[isServiceRequest] = \"isServiceRequest\">\n</ccpay-payment-view>\n\n<ng-container *ngIf=\"viewStatus === 'feeRemovalConfirmation'\">\n<div class=\"govuk-warning-text\">\n <span class=\"govuk-warning-text__icon\" aria-hidden=\"true\">!</span>\n <strong class=\"govuk-warning-text__text\">\n <span class=\"govuk-warning-text__assistive\">{{ \"Warning\" | rpxTranslate }}</span>\n {{ \"Are you sure you want to delete this fee?\" | rpxTranslate }}\n </strong>\n</div>\n<div class=\"govuk-button-grb\">\n <form novalidate>\n <button type=\"submit\" class=\"button govuk-button--secondary\" (click)=\"cancelRemoval()\">\n {{ \"Cancel\" | rpxTranslate }}\n </button>\n <button type=\"submit\" class=\"button\"\n [disabled]=\"isRemoveBtnDisabled\"\n [ngClass]='isRemoveBtnDisabled ? \"button button--disabled govuk-!-margin-right-1\" : \"button govuk-!-margin-right-1\"'\n (click)=\"removeFee(feeId)\">\n {{ \"Remove\" | rpxTranslate }}\n </button>\n </form>\n</div>\n</ng-container>\n\n<div class=\"over-payment\">\n <ng-container *ngIf=\"viewCompStatus === 'overpayment'\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='OVERPAYMENTPAGE'>\n <h1 class=\"heading-large\">{{ \"Issue refund\" | rpxTranslate }}</h1>\n <h1 class=\"heading-medium\">{{ \"Case reference\" | rpxTranslate }}: {{ccdCaseNumber | ccdHyphens }}</h1>\n <span id=\"how-contacted-conditional-hint govuk-font19px\" class=\"form-hint\">\n {{ \"Payment reference\" | rpxTranslate }}: {{paymentGroupList?.payments[0]?.reference}}\n </span>\n <div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--l\">\n <h1 class=\"heading-medium\">{{ \"Select payment to refund\" | rpxTranslate }}</h1>\n </legend>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"over-payment\" name=\"over-payment\" type=\"radio\" (click)=\"selectPymentOption('op')\" value=\"op\">\n <label class=\"govuk-label govuk-radios__label govuk-font19px\" for=\"where-do-you-live\">\n {{ \"Over payment\" | rpxTranslate }} \u00A3{{getOverPaymentValue() | number:'.2'}}\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"full-payment\" name=\"over-payment\" type=\"radio\" (click)=\"selectPymentOption('fp')\" value=\"fp\">\n <label class=\"govuk-label govuk-radios__label govuk-font19px\" for=\"where-do-you-live-2\">\n {{ \"Full payment\" | rpxTranslate }} \u00A3{{paymentGroupList?.payments[0]?.amount | number:'.2'}}\n </label>\n </div>\n </div>\n <button class=\"govuk-button govuk-button--secondary over-payment-alignment govuk-font19px\"\n (click)=\"goToPaymentViewComp()\"> {{ \"Previous\" | rpxTranslate }}</button>\n <button\n (click)=\"continuePayment(paymentGroupList)\"\n [disabled]=\"isContinueBtnDisabled\"\n [ngClass]='isContinueBtnDisabled ? \"button button--disabled govuk-!-margin-right-1 govuk-font19px\" : \"button govuk-!-margin-right-1 govuk-font19px\"'\n class=\"govuk-button\"> {{ \"Continue\" | rpxTranslate }}</button>\n </fieldset>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"viewCompStatus === 'overPaymentAddressCapture'\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='OVERPAYMENTADDRESSCAPTUREPAGE'>\n <h1 class=\"govuk-heading-l\">{{ \"Issue refund\" | rpxTranslate }}</h1>\n <h2 class=\"govuk-heading-m govuk-font19px\">{{ \"Case reference\" | rpxTranslate }}: {{ccdCaseNumber | ccdHyphens }}</h2>\n <span id=\"how-contacted-conditional-hint\" class=\"govuk-hint govuk-font19px\">\n {{ \"Payment reference\" | rpxTranslate }}: {{paymentGroupList?.payments[0]?.reference}}\n </span>\n <ccpay-contact-details\n [addressObj] = notification\n (assignContactDetails)=\"getContactDetails($event)\"\n (redirectToIssueRefund)=\"gotoPaymentSelectPage($event)\" ></ccpay-contact-details>\n <p>\n <a (click)=\"goToCaseTransationPage($event)\" class=\"govuk-link\" data-module=\"govuk-button\">\n {{ \"Cancel\" | rpxTranslate }}\n </a>\n </p>\n </ng-container>\n\n <ng-container *ngIf=\"viewCompStatus === 'overpaymentcheckandanswer'\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='ADDREFUNDFORREMISSION'>\n <div class=\"govuk-warning-text\">\n\n <h1 class=\"heading-large\"> {{ \"Check your answers\" | rpxTranslate }}</h1>\n </div>\n <table class=\"govuk-table govuk-table-mb\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Payment reference\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{paymentGroupList.payments[0].reference}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Payment amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{paymentGroupList.payments[0].amount | currency:'GBP':'symbol-narrow':'1.2-2'}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Fee amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{paymentGroupList?.fees[0]?.net_amount | currency:'GBP':'symbol-narrow':'1.2-2'}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Refund amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{getOverPaymentValue() | currency:'GBP':'symbol-narrow':'1.2-2'}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Refund reason\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{ \"Over payment\" | rpxTranslate }}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Send to\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{orderParty}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Send via\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">\n <div *ngIf=\"contactDetailsObj?.notification_type === 'EMAIL'\" class=\"contactDetails-width\">\n <strong>Email</strong>\n <br/>\n {{contactDetailsObj?.email?.trim()}}\n </div>\n <div *ngIf=\"contactDetailsObj?.notification_type === 'LETTER'\" class=\"contactDetails-width\">\n <strong>Post</strong>\n <br/>\n {{contactDetailsObj?.address_line?.trim()}}&nbsp;{{contactDetailsObj?.city?.trim()}}&nbsp;{{contactDetailsObj?.county?.trim()}}&nbsp;{{contactDetailsObj?.country?.trim()}}&nbsp;{{contactDetailsObj?.postal_code?.trim()}}\n </div>\n <a (click)=\"gotoAddressPage(contactDetailsObj)\" class=\"govuk-link right\" >Change</a>\n </td>\n </tr>\n\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">Notification</td>\n <td class=\"govuk-table__cell\">{{templateInstructionType}}\n <a *ngIf=\"!notificationPreview\" href=\"Javascript:void(0)\" class=\"govuk-link right\" (click)=\"showNotificationPreview()\">\n Preview\n </a>\n <a *ngIf=\"notificationPreview\" href=\"Javascript:void(0)\" class=\"govuk-link right\" (click)=\"hideNotificationPreview()\">\n Hide Preview\n </a>\n </td>\n </tr>\n </table>\n\n <app-notification-preview *ngIf=\"notificationPreview\"\n [payment]=\"paymentGroupList.payments[0]\"\n [contactDetails]=\"contactDetailsObj\"\n [refundReason]=\"'RR037'\"\n [refundAmount]=\"getOverPaymentValue()\"></app-notification-preview>\n\n\n <button type=\"submit\" class=\"button govuk-button--secondary over-payment-alignment govuk-font19px\" (click)=\"gotoAddressPage(contactDetailsObj)\">Previous</button>\n <button type=\"submit\"\n [ngClass]='isContinueBtnDisabled ? \"button button--disabled govuk-!-margin-right-1 govuk-font19px\" : \"button govuk-!-margin-right-1 govuk-font19px\"'\n (click)=\"processRefund()\">\n Submit refund\n </button>\n <p>\n <a href=\"javascript:void(0)\" (click)=\"goToCaseTransationPage($event)\" class=\"govuk-link govuk-font19px\" data-module=\"govuk-button\">\n Cancel\n </a>\n </p>\n\n </ng-container>\n <ng-container *ngIf=\"viewStatus === 'refundconfirmationpage' && viewCompStatus !== 'overpayment' && viewCompStatus !== 'overPaymentAddressCapture' && viewCompStatus !== 'overpaymentcheckandanswer'\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='RETROREMISSIONREFUNDCONFIRMATIONPAGE'>\n <div class=\"govuk-grid-row pagesize\">\n <div >\n <div class=\"govuk-panel govuk-panel--confirmation\">\n <h1 class=\"govuk-panel_service_request_title\">\n Refund submitted\n </h1>\n\n <div class=\"govuk-panel__body\">\n <p class=\"govuk-body white\"><strong class=\"white\">Refund reference: {{refundReference}}</strong></p>\n </div>\n\n </div>\n <h2 class=\"govuk-heading-l\">What happens next</h2>\n <p class=\"govuk-body\">\n A refund request for {{refundAmount | currency:'GBP':'symbol-narrow':'1.2-2' }} has been created and will be passed to a team leader to approve.\n </p>\n <p class=\"govuk-body\">\n <a href=\"javascript:void(0)\" (click)=\"goToCaseTransationPage($event)\" class=\"govuk-link pointer\" data-module=\"govuk-button\">\n Return to case\n </a>\n </p>\n </div>\n </div>\n\n </ng-container>\n </div>\n\n<ccpay-case-transactions *ngIf=\"viewStatus === 'case-transactions'\"\n[isFromServiceRequestPage]=\"isServiceRequest\"\n[LOGGEDINUSERROLES] = \"LOGGEDINUSERROLES\"\n[isTakePayment] = \"takePayment\">\n</ccpay-case-transactions>\n", styles: [".govuk-grid-column-full--gr{position:relative;margin-bottom:10px}.hmcts-currency-input__symbol{font-family:nta,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px;line-height:initial;position:absolute;font-weight:200;padding:8px 10px;height:40px;box-sizing:border-box;background-color:#dee0e2;border:2px solid #0b0c0c}.disable{text-decoration:none;cursor:default;color:#fff;background-color:gray;pointer-events:none}.pagesize{margin:2em;width:97%}.govuk-grid__surplus-payments{margin:20px 0}.govuk-grid__surplus-payments>.govuk-grid-column-full{padding:0}.govuk-grid__surplus-payments-col1{margin-bottom:10px}.govuk-inset-text__no-border{border-left:0px}.govuk-hidetext{font-size:22px;padding-bottom:10px}.lowercase{text-transform:lowercase}.channel:first-letter{text-transform:uppercase}.govuk-heading-xl{font-size:48px;margin-bottom:1px}.govuk-section-break--visible{border-bottom:2px solid black}.totalpayments.govuk-table__row{border-bottom:2px solid black!important}.govuk-inset-text{margin-left:1em}.govuk-button{font-size:19px;margin-bottom:0!important}.govuk-panel_service_request_title{margin-top:0;margin-bottom:30px;color:#fff;font-family:nta,Arial,sans-serif;-webkit-font-smoothing:antialiased;font-weight:700;font-size:48px}.groupamount.govuk-table__header,.govuk-table__cell.govuk-table__cell--col6.govuk-table__custom--col6{text-align:right}.feeclass{padding-left:.7em}.align-center{text-align:center}details summary{display:list-item}.case-transaction__color{color:#a71414;font-weight:700;text-align:center}.capitalize:first-letter{text-transform:uppercase}.govuk-inset-text__no-left-margin{margin-left:0;padding-left:0}.whitespace-inherit{white-space:inherit!important}.govuk-section-records-break{margin:10px;border-bottom:2px solid black!important}.exisitng-fees{margin-left:12px}.add-telephony-payment{margin-top:-2em;margin-left:-2em}.govuk-table__header--custom{text-align:center}.disable-link{cursor:default;pointer-events:none;color:#8e8c8c}.panel-no--style{border-left-style:none}.col-28{width:28%!important}.col-8{width:8%!important}.col-60{width:60%!important}.col-32{width:32%!important}.col-34{width:34%!important}#bckLnksize{font-size:16px!important}.col-15{width:15%!important;padding-right:0!important;padding-left:0!important}.col-16{width:16%!important}.col-14{width:14%!important}.col-17{width:17%!important}.col-12{width:12%!important}.col-9{width:9%!important}.col-10{width:10%!important}.col-11{width:11%!important}.col-13{width:13%!important}.col-21{width:21%!important}.col-20{width:20%!important}.col-24{width:24%!important}.govuk-table__cell,.govuk-table__header{padding:10px 10px 10px 0}.col-27{width:27%!important}td{white-space:nowrap;overflow:hidden!important}.col-19{width:19%!important;padding-left:0!important}.col-18{width:18%!important;padding-left:0!important;padding-right:0!important}.col-37{width:37%!important}.col-55{width:55%!important}.govuk-table{margin-bottom:1px}.hmcts-banner>.hmcts-banner__message{font-size:19px;line-height:1.25}.summary-table-font{font-size:36px}.order-class{padding-top:3em}.govuk-table__header:last-child{text-align:right}.govuk-table__cell:last-child{text-align:right}.govuk-grid-column-two-thirds{width:64%!important;padding:0!important}.govuk-heading-l{font-size:36px;margin-bottom:10px}.paymentrequest{margin-top:1em}.mar-17{margin-left:17px}.col-61{width:61px!important;padding:0!important}.error{width:960px;margin:auto}.summarypage{padding-left:36em;margin-top:2em}.summarypagealign{width:100%;text-align:right;margin-top:2em}.govuk-inset-text{font-size:2.1875rem}table{table-layout:fixed;width:100%}th,td{word-wrap:break-word}.totalPay{padding-right:14px;float:right;margin-top:2em}.govuk-back-link{font-size:1.5rem!important}.totalfees{float:right;margin-top:2em}.refundBtn{text-align:right;width:18%}.col-25{width:25%!important}.col-51{width:51%!important}.alignright{text-align:right}.alignleft{text-align:left}.alignself{align-self:flex-end}.maxwidth{width:100%}.over-payment .govuk-table-mb{margin-bottom:20px}.over-payment .contactDetails-width{width:70%}.over-payment .margin-top10px{margin-top:20px}.over-payment .govuk-font19px{font-size:19px!important}.over-payment .margin-top--size{margin-top:-30px}.over-payment .over-payment-alignment{margin-right:10px}.over-payment .govuk-button{font-size:19px;float:left;margin-top:2em}.over-payment td.govuk-table__cell{width:50%;text-align:left}.over-payment .govuk-warning-text__text,.over-payment .govuk-label--s,.over-payment .service-label__symbol{font-size:19px;font-weight:400}.over-payment .inline-error-class{outline:3px solid #a71414;outline-offset:0;border-color:#a71414}.over-payment .inline-error-message{color:#a71414;border-color:#a71414;font-weight:700;margin-top:10px;font-size:20px}.over-payment .govuk-button-group{padding-top:2em}.over-payment .heading-medium{margin-top:.875em}.over-payment .heading-large{margin-top:.25em}.over-payment .govuk-panel--confirmation{color:#fff;background:#00703c}.over-payment .govuk-panel__title{font-size:5rem}.over-payment .govuk-body-m,.over-payment .govuk-body{font-size:2.1875rem}.over-payment .govuk-link{cursor:pointer}.over-payment .govuk-radios__conditional{padding-top:12px!important}.over-payment .right{float:right;cursor:pointer}.over-payment .radio{float:right}.over-payment .white{color:#fff}\n"], dependencies: [{ kind: "component", type: i0.forwardRef(() => AddRemissionComponent), selector: "ccpay-add-remission", inputs: ["fee", "fees", "payment", "remission", "ccdCaseNumber", "caseType", "viewCompStatus", "paymentGroupRef", "isTurnOff", "isRefundRemission", "isStrategicFixEnable", "paidAmount", "isFromRefundListPage", "isFromPaymentDetailPage", "isFromServiceRequestPage", "isFullyRefund", "feeamount", "refundPaymentReference", "isFromRefundStatusPage", "changeRefundReason", "isServiceRequest", "LOGGEDINUSERROLES", "orderDetail", "orderRef", "orderStatus", "orderParty", "orderCreated", "orderCCDEvent", "takepayment", "orderFeesTotal", "orderTotalPayments", "orderRemissionTotal"], outputs: ["cancelRemission", "refundListReason", "refundListAmount", "refundFees"] }, { kind: "ngmodule", type: i0.forwardRef(() => CommonModule) }, { kind: "directive", type: i0.forwardRef(() => i3.NgClass), selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i0.forwardRef(() => i3.NgForOf), selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i0.forwardRef(() => i3.NgIf), selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i0.forwardRef(() => PaymentViewComponent), selector: "ccpay-payment-view", inputs: ["isTurnOff", "isTakePayment", "caseType", "orderRef", "orderStatus", "orderTotalPayments", "payment", "LOGGEDINUSERROLES", "ISPAYMENTSTATUSENABLED", "orderParty", "orderCreated", "orderCCDEvent", "orderFeesTotal", "orderRemissionTotal", "orderDetail", "isServiceRequest"] }, { kind: "component", type: i0.forwardRef(() => ContactDetailsComponent), selector: "ccpay-contact-details", inputs: ["isEditOperation", "isEditOperationInRefundList", "addressObj"], outputs: ["assignContactDetails", "assignContactDetailsInFefundsList", "redirectToIssueRefund"] }, { kind: "component", type: i0.forwardRef(() => NotificationPreviewComponent), selector: "app-notification-preview", inputs: ["payment", "contactDetails", "refundReason", "refundAmount", "paymentReference", "refundReference", "previewJourney", "notificationSent"], outputs: ["notificationPreviewEvent"] }, { kind: "component", type: i0.forwardRef(() => CaseTransactionsComponent), selector: "ccpay-case-transactions", inputs: ["LOGGEDINUSERROLES", "isTakePayment", "isFromServiceRequestPage"] }, { kind: "ngmodule", type: i0.forwardRef(() => RpxTranslationModule) }, { kind: "pipe", type: i0.forwardRef(() => i3.DecimalPipe), name: "number" }, { kind: "pipe", type: i0.forwardRef(() => i3.CurrencyPipe), name: "currency" }, { kind: "pipe", type: i0.forwardRef(() => i3.DatePipe), name: "date" }, { kind: "pipe", type: i0.forwardRef(() => CcdHyphensPipe), name: "ccdHyphens" }, { kind: "pipe", type: i0.forwardRef(() => i8.RpxTranslatePipe), name: "rpxTranslate" }] });
3368
3376
  }
3369
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: ServiceRequestComponent, decorators: [{
3377
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: ServiceRequestComponent, decorators: [{
3370
3378
  type: Component,
3371
3379
  args: [{ selector: 'ccpay-service-request', providers: [{ provide: 'SERVICE_REQUEST', useExisting: forwardRef(() => ServiceRequestComponent) }], imports: [
3372
3380
  forwardRef(() => AddRemissionComponent),
@@ -4007,7 +4015,7 @@ class AddRemissionComponent {
4007
4015
  if (this.paymentLibComponent.REFUNDLIST === "true") {
4008
4016
  this.isFromRefundListPage = true;
4009
4017
  }
4010
- this.totalRefundAmount = this.remissionForm.value.feesList.reduce((a, c) => a + c.refund_amount * c.selected, 0);
4018
+ this.totalRefundAmount = this.calculateTotalRefundAmount(this.remissionForm.value.feesList);
4011
4019
  this.errorMessage = '';
4012
4020
  this.errorMsg = [];
4013
4021
  this.refundReason = this.remissionForm.controls['refundReason'].value === null ? this.remissionForm.controls['refundDDReason'].value : this.remissionForm.controls['refundReason'].value;
@@ -4026,7 +4034,7 @@ class AddRemissionComponent {
4026
4034
  }
4027
4035
  else {
4028
4036
  if (this.isFromCheckAnsPage) {
4029
- this.totalRefundAmount = this.remissionForm.value.feesList.reduce((a, c) => a + c.refund_amount * c.selected, 0);
4037
+ this.totalRefundAmount = this.calculateTotalRefundAmount(this.remissionForm.value.feesList);
4030
4038
  this.isFromCheckAnsPage = false;
4031
4039
  this.viewStatus = 'checkissuerefundpage';
4032
4040
  this.viewCompStatus = '';
@@ -4040,7 +4048,7 @@ class AddRemissionComponent {
4040
4048
  else {
4041
4049
  this.displayRefundReason = this.selectedRefundReason;
4042
4050
  if (this.isFromCheckAnsPage) {
4043
- this.totalRefundAmount = this.remissionForm.value.feesList.reduce((a, c) => a + c.refund_amount * c.selected, 0);
4051
+ this.totalRefundAmount = this.calculateTotalRefundAmount(this.remissionForm.value.feesList);
4044
4052
  this.isFromCheckAnsPage = false;
4045
4053
  this.viewStatus = 'checkissuerefundpage';
4046
4054
  this.viewCompStatus = '';
@@ -4140,7 +4148,7 @@ class AddRemissionComponent {
4140
4148
  if (this.errorMsg.length === 0) {
4141
4149
  if (this.isFromCheckAnsPage) {
4142
4150
  this.isFromCheckAnsPage = false;
4143
- this.totalRefundAmount = this.remissionForm.value.feesList.reduce((a, c) => a + c.refund_amount * c.selected, 0);
4151
+ this.totalRefundAmount = this.calculateTotalRefundAmount(this.remissionForm.value.feesList);
4144
4152
  this.fees = this.remissionForm.value.feesList.filter(value => value.selected === true);
4145
4153
  this.viewStatus = 'checkissuerefundpage';
4146
4154
  this.viewCompStatus = '';
@@ -4149,7 +4157,7 @@ class AddRemissionComponent {
4149
4157
  }
4150
4158
  else if (this.isFromRefundStatusPage) {
4151
4159
  var remissionctrls = this.remissionForm.controls;
4152
- this.totalRefundAmount = this.remissionForm.value.feesList.reduce((a, c) => a + c.refund_amount * c.selected, 0);
4160
+ this.totalRefundAmount = this.calculateTotalRefundAmount(this.remissionForm.value.feesList);
4153
4161
  this.refundListAmount.emit(this.totalRefundAmount.toString());
4154
4162
  this.fees = this.remissionForm.value.feesList.filter(value => value.selected === true);
4155
4163
  this.refundFees.emit(this.fees);
@@ -4572,10 +4580,16 @@ class AddRemissionComponent {
4572
4580
  getRemissionValueForFullyRefund() {
4573
4581
  return 0;
4574
4582
  }
4575
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: AddRemissionComponent, deps: [{ token: i1$1.FormBuilder }, { token: i1$2.Router }, { token: PaymentViewService }, { token: NotificationService }, { token: 'PAYMENT_LIB' }, { token: RefundsService }, { token: i0.ChangeDetectorRef }, { token: OrderslistService }], target: i0.ɵɵFactoryTarget.Component });
4576
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.1", type: AddRemissionComponent, isStandalone: true, selector: "ccpay-add-remission", inputs: { fee: "fee", fees: "fees", payment: "payment", remission: "remission", ccdCaseNumber: "ccdCaseNumber", caseType: "caseType", viewCompStatus: "viewCompStatus", paymentGroupRef: "paymentGroupRef", isTurnOff: "isTurnOff", isRefundRemission: "isRefundRemission", isStrategicFixEnable: "isStrategicFixEnable", paidAmount: "paidAmount", isFromRefundListPage: "isFromRefundListPage", isFromPaymentDetailPage: "isFromPaymentDetailPage", isFromServiceRequestPage: "isFromServiceRequestPage", isFullyRefund: "isFullyRefund", feeamount: "feeamount", refundPaymentReference: "refundPaymentReference", isFromRefundStatusPage: "isFromRefundStatusPage", changeRefundReason: "changeRefundReason", isServiceRequest: "isServiceRequest", LOGGEDINUSERROLES: "LOGGEDINUSERROLES", orderDetail: "orderDetail", orderRef: "orderRef", orderStatus: "orderStatus", orderParty: "orderParty", orderCreated: "orderCreated", orderCCDEvent: "orderCCDEvent", takePayment: ["takepayment", "takePayment"], orderFeesTotal: "orderFeesTotal", orderTotalPayments: "orderTotalPayments", orderRemissionTotal: "orderRemissionTotal" }, outputs: { cancelRemission: "cancelRemission", refundListReason: "refundListReason", refundListAmount: "refundListAmount", refundFees: "refundFees" }, providers: [{ provide: 'ADD_REMISSION', useExisting: AddRemissionComponent }], ngImport: i0, template: "<div class=\"add-remission pagesize\">\n <div *ngIf=\"errorMessage\">\n <div class=\"error-summary\" role=\"group\" aria-labelledby=\"failure-error-summary-heading\" tabindex=\"-1\">\n <h2 class=\"heading-medium error-summary-heading\" id=\"failure-error-summary-heading\">\n {{ \"Error in processing the request\" | rpxTranslate }}\n </h2>\n <div class=\"govuk-error-summary__body\">\n {{ errorMessage | rpxTranslate }}\n </div>\n </div>\n </div>\n <div *ngIf=\"errorMsg.length > 0\">\n <div class=\"error-summary\" role=\"group\" aria-labelledby=\"failure-error-summary-heading\" tabindex=\"-1\">\n <h2 class=\"heading-medium error-summary-heading\" id=\"failure-error-summary-heading\">\n {{ \"Error in processing the request\" | rpxTranslate }}\n </h2>\n <div *ngFor=\"let err of errorMsg; let i = index\" class=\"govuk-error-summary__body\">\n\n <li>{{ err | rpxTranslate }}</li>\n </div>\n </div>\n </div>\n\n<ng-container *ngIf=\"viewStatus === 'main' && !isRefundRemission \">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='ADDREMISSION'>\n <h1 class=\"heading-large\">{{ \"Add remission\" | rpxTranslate }} </h1>\n <form novalidate>\n <div class=\"govuk-form-group\">\n <form [formGroup]=\"remissionForm\" novalidate>\n <div class=\"govuk-form-group\">\n <label class=\"govuk-label govuk-label--s\" for=\"remission-code\">\n {{ \"Add remission to\" | rpxTranslate }} {{ fee?.code }}: {{ fee?.description | rpxTranslate }}\n <span class=\"form-hint\">{{ \"Enter remission for reference\" | rpxTranslate }}. {{ \"For example\" | rpxTranslate }}: HWF-A1B-23C OR PA21-123456</span>\n </label>\n <input [ngClass]=\"{'inline-error-class': isRemissionCodeEmpty || remissionCodeHasError}\" class=\"govuk-input govuk-input--width-20 govuk-!-margin-right-1\" id=\"remissionCode\" aria-label=\"remissionCode\" name=\"remissionCode\" type=\"text\" formControlName=\"remissionCode\">\n <p class=\"inline-error-message\" *ngIf=\"isRemissionCodeEmpty || remissionCodeHasError\">\n <span *ngIf=\"isRemissionCodeEmpty\">{{ \"Enter a remission code\" | rpxTranslate }}</span>\n <span *ngIf=\"remissionCodeHasError\">{{ \"Enter a vaild remission code\" | rpxTranslate }}</span>\n </p>\n </div>\n <div class=\"govuk-form-group\">\n <label class=\"govuk-label govuk-label--s\" for=\"amount\">\n {{ \"How much does the applicant need to pay\" | rpxTranslate }}?\n </label>\n\n <div id=\"amount-currency\" class=\"govuk-visually-hidden\">{{ \"in pounds\" | rpxTranslate }}</div>\n <div class=\"hmcts-currency-input\">\n <div class=\"hmcts-currency-input__symbol\" aria-hidden=\"true\">\u00A3</div>\n <input class=\"govuk-input govuk-input-width-10-left\" [ngClass]=\"{'inline-error-class': isAmountEmpty || amountHasError || isRemissionLessThanFeeError}\" id=\"amount\" aria-label=\"amount\" name=\"amount\" type=\"text\" aria-describedby=\"amount-currency\" formControlName=\"amount\">\n <p class=\"inline-error-message\" *ngIf=\"isAmountEmpty || amountHasError || isRemissionLessThanFeeError\">\n <span *ngIf=\"isAmountEmpty\">{{ \"Enter a amount\" | rpxTranslate }}</span>\n <span *ngIf=\"amountHasError\">{{ \"Enter a vaild amount\" | rpxTranslate }}</span>\n <span *ngIf=\"isRemissionLessThanFeeError\">{{ \"The remission amount must be less than the total fee\" | rpxTranslate }}</span>\n </p>\n </div>\n </div>\n </form>\n <button class=\"button\" type=\"submit\" (click)=\"addRemission()\">\n {{ \"Submit\" | rpxTranslate }}\n </button>\n </div>\n </form>\n</ng-container>\n\n<ng-container *ngIf=\"viewStatus === 'confirmation'\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='ADDREMISSIONCONFIRMATION'>\n <div class=\"govuk-warning-text\">\n <span class=\"govuk-warning-text__icon\" aria-hidden=\"true\">!</span>\n <strong class=\"govuk-warning-text__text\">\n <span class=\"govuk-warning-text__assistive\">{{ \"Warning\" | rpxTranslate }}</span>\n {{ \"Are you sure you want to add remission to this fee\" | rpxTranslate }}?\n </strong>\n </div>\n <table class=\"govuk-table\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Remission code\" | rpxTranslate }}:</td>\n <td class=\"govuk-table__cell\">{{ remissionForm.controls.remissionCode.value }}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Fee code\" | rpxTranslate }}:</td>\n <td class=\"govuk-table__cell\">{{ fee.code }}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Fee description\" | rpxTranslate }}:</td>\n <td class=\"govuk-table__cell\">{{ fee.description | rpxTranslate }}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Amount the applicant must pay\" | rpxTranslate }}:</td>\n <td class=\"govuk-table__cell\">{{ remissionForm.controls.amount.value | currency:'GBP':'symbol-narrow':'1.2-2' }}</td>\n </tr>\n </table>\n\n <button type=\"submit\" class=\"button govuk-button--secondary\" (click)=\"cancelRemission.emit()\">\n {{ \"Cancel\" | rpxTranslate }}\n </button>\n <button type=\"submit\"\n [disabled]=\"isConfirmationBtnDisabled\"\n [ngClass]='isConfirmationBtnDisabled ? \"button button--disabled govuk-!-margin-right-1\" : \"button govuk-!-margin-right-1\"'\n (click)=\"confirmRemission()\">\n {{ \"Confirm\" | rpxTranslate }}\n </button>\n\n</ng-container>\n\n<!-- Add retro remission changes-->\n\n<ng-container *ngIf=\"viewCompStatus === 'addremission'\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='PROCESSADDRETROREMISSIONPAGE'>\n <h1 class=\"heading-large\">{{ \"Process remission\" | rpxTranslate }}</h1>\n <h1 class=\"heading-medium\">#{{ccdCaseNumber | ccdHyphens}}</h1>\n <h1 class=\"heading-large\">{{ \"Enter help with fees or remission reference\" | rpxTranslate }}</h1>\n <form novalidate>\n <div class=\"govuk-form-group\">\n <form [formGroup]=\"remissionForm\" novalidate>\n <div class=\"govuk-form-group\">\n <label class=\"govuk-label govuk-label--s\" for=\"remission-code\">\n <span class=\"form-hint\">{{ \"For example\" | rpxTranslate }}: HWF-A1B-23C OR PA21-123456</span>\n </label>\n <p class=\"inline-error-message\" *ngIf=\"isRemissionCodeEmpty || remissionCodeHasError\">\n <span *ngIf=\"isRemissionCodeEmpty\">{{ \"Enter a remission code\" | rpxTranslate }}</span>\n <span *ngIf=\"remissionCodeHasError\">{{ \"Enter a vaild remission code\" | rpxTranslate }}</span>\n </p>\n <input [ngClass]=\"{'inline-error-class': isRemissionCodeEmpty || remissionCodeHasError}\" class=\"govuk-input govuk-input--width-20 govuk-!-margin-right-1\" id=\"remissionCode\" aria-label=\"remissionCode\" name=\"remissionCode\" type=\"text\" formControlName=\"remissionCode\">\n\n </div>\n\n </form>\n <div class=\"govuk-button-group\">\n <button (click)=\"gotoServiceRequestPage($event)\" class=\"govuk-button govuk-button--secondary\"> {{ \"Previous\" | rpxTranslate }}</button>\n <button (click)=\"addRemissionCode()\" class=\"govuk-button\"> {{ \"Continue\" | rpxTranslate }}</button>\n </div>\n <p><a href=\"javascript:void(0)\" (click)=\"gotoCasetransationPageCancelBtnClicked($event)\" class=\"govuk-link pointer\" data-module=\"govuk-button\">{{ \"Cancel\" | rpxTranslate }}</a></p>\n </div>\n </form>\n\n</ng-container>\n\n<ng-container *ngIf=\"viewStatus === 'processretroremissonpage'\" >\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='PROCESSRETROREMISSIONPAGE'>\n <h1 class=\"heading-large\">{{ \"Process remission\" | rpxTranslate }}</h1>\n <h1 class=\"heading-medium\">#{{ccdCaseNumber | ccdHyphens }}</h1>\n <div class=\"govuk-form-group\">\n <form novalidate>\n <div class=\"govuk-form-group\">\n <form [formGroup]=\"remissionForm\" novalidate>\n <fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">\n <h1 *ngIf=\"remessionPayment?.status === 'Success' || isFromRefundListPage\" class=\"heading-medium\">\n {{ \"Enter the HWF or remission amount\" | rpxTranslate }}\n </h1>\n <h1 *ngIf=\"remessionPayment?.status !== 'Success' && !isFromRefundListPage\" class=\"heading-medium\">\n {{ \"Enter the remission amount\" | rpxTranslate }}\n </h1>\n <h1 *ngIf=\"remessionPayment?.status === 'undefined'\" class=\"heading-medium\">\n {{ \"Enter the amount\" | rpxTranslate }}\n </h1>\n </legend>\n <div id=\"amount-currency\" class=\"govuk-visually-hidden\">{{ \"in pounds\" | rpxTranslate }}</div>\n <p class=\"inline-error-message\" *ngIf=\"isAmountEmpty || amountHasError || isRemissionLessThanFeeError\">\n <span *ngIf=\"isAmountEmpty\">{{ \"Enter a amount\" | rpxTranslate }}</span>\n <span *ngIf=\"amountHasError\">{{ \"Enter a vaild amount\" | rpxTranslate }}</span>\n <span *ngIf=\"isRemissionLessThanFeeError\">{{ \"You cannot add a remission that's more than the fee amount\" | rpxTranslate }}.</span>\n </p>\n <div class=\"hmcts-currency-input\">\n\n <div class=\"hmcts-currency-input__symbol\" aria-hidden=\"true\">\u00A3</div>\n <input class=\"govuk-input govuk-input-width-10-left\" [ngClass]=\"{'inline-error-class': isAmountEmpty || amountHasError || isRemissionLessThanFeeError}\" id=\"amount\" aria-label=\"amount\" name=\"amount\" type=\"number\" aria-describedby=\"amount-currency\" formControlName=\"amount\">\n\n\n </div>\n </fieldset>\n </form>\n\n <div class=\"govuk-button-group\">\n <button (click)=\"gotoAddRetroRemissionCodePage()\" class=\"govuk-button govuk-button--secondary\"> {{ \"Previous\" | rpxTranslate }}</button>\n <button (click)=\"gotoCheckRetroRemissionPage(payment)\" class=\"govuk-button\"> {{ \"Continue\" | rpxTranslate }}</button>\n\n </div>\n <p>\n <a href=\"javascript:void(0)\" (click)=\"gotoCasetransationPageCancelBtnClicked($event)\" class=\"govuk-link\" data-module=\"govuk-button\">{{ \"Cancel\" | rpxTranslate }}</a>\n </p>\n </div>\n\n </form>\n </div>\n</ng-container>\n<ng-container *ngIf=\"viewStatus === 'checkretroremissionpage'\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='CHECKRETROREMISSIONCONFIRMATION'>\n <div class=\"govuk-warning-text\">\n <h1 class=\"heading-large\"> {{ \"Check your answers\" | rpxTranslate }}</h1>\n </div>\n <table class=\"govuk-table\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Payment reference\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{remessionPayment ? remessionPayment.reference: ' '}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Payment amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">\u00A3{{ remessionPayment ? getFormattedCurrency(remessionPayment.amount): ' ' | currency :'GBP':'symbol':'1.2-2'}} </td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Payment status\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{remessionPayment ? remessionPayment.status: ''}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Fee\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{ fee.code }} - {{ fee.description | rpxTranslate }} </td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Fee amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{ fee.calculated_amount/fee.volume| currency:'GBP':'symbol-narrow':'1.2-2' }}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Help with fees or remission reference\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{ remissionForm.controls.remissionCode.value?.trim() }}\n <a (click)=\"gotoProcessRetroRemissionPage()\" class=\"govuk-link right\" >{{ \"Change\" | rpxTranslate }}</a>\n </td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Remission amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{remissionForm.controls.amount.value | currency:'GBP':'symbol-narrow':'1.2-2' }}\n <a (click)=\"gotoAmountRetroRemission()\" class=\"govuk-link right\" >{{ \"Change\" | rpxTranslate }}</a>\n </td>\n </tr>\n </table>\n\n <button type=\"submit\" class=\"button govuk-button--secondary\" (click)=\"gotoAmountRetroRemission()\">{{ \"Previous\" | rpxTranslate }}</button>\n <button type=\"submit\" [disabled]=\"isConfirmationBtnDisabled\" [ngClass]='isConfirmationBtnDisabled ? \"button button--disabled govuk-!-margin-right-1\" : \"button govuk-!-margin-right-1\"' (click)=\"confirmRetroRemission()\"> {{ \"Add remission\" | rpxTranslate }} </button>\n <p> <a href=\"javascript:void(0)\" (click)=\"gotoCasetransationPageCancelBtnClicked($event)\" class=\"govuk-link\" data-module=\"govuk-button\"> {{ \"Cancel\" | rpxTranslate }}</a> </p>\n\n</ng-container>\n\n<ng-container *ngIf=\"viewStatus === 'retroremissionconfirmationpage'\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='RETROREMISSIONCONFIRMATIONPAGE'>\n <div class=\"govuk-grid-row\">\n <div >\n <div class=\"govuk-panel govuk-panel-border--confirmation\">\n <h1 class=\"govuk-panel__title\">\n {{ \"Remission added\" | rpxTranslate }}\n </h1>\n <div *ngIf=\"remessionPayment.status === 'Success'\" class=\"govuk-panel__body\">\n <p class=\"govuk-body\"><strong>{{ \"The amount to be refunded should be\" | rpxTranslate }} {{remissionForm.controls.amount.value | currency:'GBP':'symbol-narrow':'1.2-2' }}</strong></p>\n\n </div>\n </div>\n <div *ngIf=\"remessionPayment.status === 'Success'\" >\n <button type=\"submit\" [disabled]=\"!canRefundBeApplied()\" [ngClass]='isConfirmationBtnDisabled ? \"button button--disabled govuk-!-margin-right-1\" : \"button govuk-!-margin-right-1\"' (click)=\"gotoProcessRetroRemission()\">{{ \"Continue\" | rpxTranslate }} </button>\n </div>\n <p class=\"govuk-body\">\n <a href=\"javascript:void(0)\" (click)=\"gotoCasetransationPageCancelBtnClicked($event)\" class=\"govuk-link pointer\" data-module=\"govuk-button\">\n {{ \"Return to case\" | rpxTranslate }}\n </a>\n </p>\n </div>\n </div>\n</ng-container>\n\n\n<ng-container *ngIf=\"viewStatus === 'remissionAddressPage'\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='ADDRESSDETAILSRETROREMISSIONPAGE'>\n <h1 class=\"govuk-heading-l\">{{ \"Process refund\" | rpxTranslate }}</h1>\n <h2 class=\"govuk-heading-m govuk-font19px\">{{ \"Case reference\" | rpxTranslate }}: {{ccdCaseNumber | ccdHyphens }}</h2>\n <ccpay-contact-details\n [addressObj] = notification\n (assignContactDetails)=\"getContactDetails($event, 'checkaddRefundpage')\"\n (redirectToIssueRefund)=\"gotoRemissionSuccess($event)\" ></ccpay-contact-details>\n <p>\n <a (click)=\"gotoCasetransationPageCancelBtnClicked($event)\" class=\"govuk-link\" data-module=\"govuk-button\">\n {{ \"Cancel\" | rpxTranslate }}\n </a>\n </p>\n\n</ng-container>\n\n<ng-container *ngIf=\"viewStatus === 'checkaddRefundpage'\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='CHECKRETROREMISSIONCONFIRMATION'>\n <div class=\"govuk-warning-text\">\n <h1 class=\"heading-large\"> {{ \"Check your answers\" | rpxTranslate }}</h1>\n </div>\n <table class=\"govuk-table\">\n\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Reason for refund\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{ \"Retrospective remission\" | rpxTranslate }}</td>\n </tr>\n\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Payment reference\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{remessionPayment ? remessionPayment.reference: ' '}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Payment amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">\u00A3{{ remessionPayment ? getFormattedCurrency(remessionPayment.amount): ' ' | currency :'GBP':'symbol':'1.2-2'}} </td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Payment status\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{remessionPayment ? remessionPayment.status: '' | rpxTranslate}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Fee\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{ fee.code }} - {{ fee.description | rpxTranslate }} ({{ fee.calculated_amount/fee.volume| currency:'GBP':'symbol-narrow':'1.2-2' }}) </td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Help with fees or remission reference\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{ remissionForm.controls.remissionCode.value?.trim() }}\n </td>\n </tr>\n\n <tr class=\"govuk-table__row\">\n <td *ngIf=\"remessionPayment.status === 'Success'\" class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Remission amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{remissionForm.controls.amount.value | currency:'GBP':'symbol-narrow':'1.2-2' }}\n </td>\n </tr>\n\n <tr class=\"govuk-table__row\">\n <td *ngIf=\"remessionPayment.status === 'Success'\" class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Refund amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{ getRefundAmountToBeDisplayedForContinueJourney()| currency:'GBP':'symbol-narrow':'1.2-2' }}\n </td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Send to\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{orderParty}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Send via\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">\n <div *ngIf=\"contactDetailsObj?.notification_type === 'EMAIL'\" class=\"contactDetails-width\">\n <strong>{{ \"Email\" | rpxTranslate }}</strong>\n <br/>\n {{contactDetailsObj?.email?.trim()}}\n </div>\n <div *ngIf=\"contactDetailsObj?.notification_type === 'LETTER'\" class=\"contactDetails-width\">\n <strong>{{ \"Post\" | rpxTranslate }}</strong>\n <br/>\n {{contactDetailsObj?.address_line?.trim()}}&nbsp;{{contactDetailsObj?.city?.trim()}}&nbsp;{{contactDetailsObj?.county?.trim()}}&nbsp;{{contactDetailsObj?.country?.trim()}}&nbsp;{{contactDetailsObj?.postal_code?.trim()}}\n </div>\n <a (click)=\"gotoProcessRetroRemission(contactDetailsObj)\" class=\"govuk-link right\" >{{ \"Change\" | rpxTranslate }}</a>\n </td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Notification\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{templateInstructionType}}\n <a *ngIf=\"!notificationPreview\" href=\"Javascript:void(0)\" class=\"govuk-link right\" (click)=\"showNotificationPreview()\">\n {{ \"Preview\" | rpxTranslate }}\n </a>\n <a *ngIf=\"notificationPreview\" href=\"Javascript:void(0)\" class=\"govuk-link right\" (click)=\"hideNotificationPreview()\">\n {{ \"Hide Preview\" | rpxTranslate }}\n </a>\n </td>\n </tr>\n </table>\n\n <app-notification-preview *ngIf=\"notificationPreview\"\n [payment]=\"remessionPayment\"\n [contactDetails]=\"contactDetailsObj\"\n [refundReason]=\"'RR036'\"\n [refundAmount]=\"remissionForm.controls.amount.value\"></app-notification-preview>\n\n <button type=\"submit\" class=\"button govuk-button--secondary\" (click)=\"gotoProcessRetroRemission(contactDetailsObj)\">{{ \"Previous\" | rpxTranslate }}</button>\n <button type=\"submit\" [disabled]=\"isConfirmationBtnDisabled\" [ngClass]='isConfirmationBtnDisabled ? \"button button--disabled govuk-!-margin-right-1\" : \"button govuk-!-margin-right-1\"' (click)=\"processRefund()\"> {{ \"Submit refund\" | rpxTranslate }} </button>\n <p> <a href=\"javascript:void(0)\" (click)=\"gotoCasetransationPageCancelBtnClicked($event)\" class=\"govuk-link\" data-module=\"govuk-button\"> {{ \"Cancel\" | rpxTranslate }}</a> </p>\n\n</ng-container>\n\n<ng-container *ngIf=\"viewStatus === 'refundconfirmationpage'\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='RETROREMISSIONREFUNDCONFIRMATIONPAGE'>\n <div class=\"govuk-grid-row\">\n <div >\n <div class=\"govuk-panel govuk-panel--confirmation\">\n <h1 class=\"govuk-panel_remission_title\">\n {{ \"Refund submitted\" | rpxTranslate }}\n </h1>\n\n <div class=\"govuk-panel__body\">\n <p class=\"govuk-body white\"><strong class=\"white\">{{ \"Refund reference\" | rpxTranslate }}: {{refundReference}}</strong></p>\n </div>\n\n </div>\n <div *ngIf=\"isPaymentSuccess\">\n <h2 class=\"govuk-heading-l\">{{ \"What happens next\" | rpxTranslate }}</h2>\n <p class=\"govuk-body\">\n {{ \"A refund request for\" | rpxTranslate }} {{refundAmount | currency:'GBP':'symbol-narrow':'1.2-2' }} {{ \"has been created and will be passed to a team leader to approve\" | rpxTranslate }}.\n </p>\n </div>\n <p class=\"govuk-body\">\n <a href=\"javascript:void(0)\" (click)=\"gotoCasetransationPageCancelBtnClicked($event)\" class=\"govuk-link pointer\" data-module=\"govuk-button\">\n {{ \"Return to case\" | rpxTranslate }}\n </a>\n </p>\n </div>\n </div>\n\n</ng-container>\n\n<!-- Issue Refund Section -->\n<ng-container *ngIf=\"viewCompStatus === 'issuerefund' && isRefundRemission\">\n <div class=\"govuk-form-group\">\n <form [formGroup]=\"remissionForm\" novalidate>\n <h1 class=\"heading-large\">{{ \"Process refund\" | rpxTranslate }}</h1>\n <h2 class=\"heading-medium\">{{ \"Case reference\" | rpxTranslate }}:{{ccdCaseNumber | ccdHyphens }}</h2>\n <span id=\"how-contacted-conditional-hint\" class=\"form-hint govuk-font19px\">\n {{ \"Payment reference\" | rpxTranslate }}: {{paymentReference}}\n </span>\n <h3 class=\"heading-small\">{{ \"Select fees to be refunded\" | rpxTranslate }}</h3>\n <!--TABLE-->\n <div>\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header col-1\" scope=\"col\">{{ \"Select\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-18\" scope=\"col\">{{ \"Fee description\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-6\" scope=\"col\">{{ \"Fee amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-6\" scope=\"col\">{{ \"Total paid\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-6\" scope=\"col\">{{ \"Remission amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-6\" scope=\"col\">{{ \"Quantity\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-8\" scope=\"col\">{{ \"Amount to refund\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header\" scope=\"col\"></td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\" *ngIf=\"!isFullyRefund\">\n <tr class=\"govuk-table__row\" formArrayName=\"feesList\" *ngFor=\"let fee of feesList?.controls; let i = index\">\n <td class=\"govuk-table__cell\">\n <div [formGroupName]=\"i\" class=\"govuk-checkboxes govuk-checkboxes--large\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input\n class=\"govuk-checkboxes__input\"\n (click)=\"check_en(i,fee.controls['id'].value,fee.controls['apportion_amount'].value,fee.controls['volume'].value)\"\n id=\"{{fee.controls['id'].value}}\"\n name=\"organisation\"\n type=\"checkbox\"\n value=\"{{fee.controls['id'].value}}\"\n formControlName=\"selected\" >\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"{{fee.controls['id'].value}}\">\n <span style=\"display:none\">{{ \"Select\" | rpxTranslate }}</span>\n </label>\n </div>\n </div>\n </td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{fee.controls['description'].value}} </td>\n <td class=\"govuk-table__cell whitespace-inherit left\" >\n <div type=\"hidden\" style=\"display:none;background-color:white;\" id=\"feeVOl_{{fee.controls['id'].value}}\">{{ fee.controls['calculated_amount'].value / fee.controls['volume'].value }}</div>\n {{ fee.controls['calculated_amount'].value / fee.controls['volume'].value | currency:'GBP':'symbol-narrow':'1.2-2' }}\n </td>\n <td class=\"govuk-table__cell whitespace-inherit left\" >{{ fee.controls['apportion_amount'].value | currency:'GBP':'symbol-narrow':'1.2-2'}} </td>\n <td class=\"govuk-table__cell whitespace-inherit left\" >\n <div type=\"hidden\" style=\"display:none;background-color:white;\" id=\"feeVOl_{{fee.controls['id'].value}}\">{{ this.getRemissionsHwfAmount(fee.controls['code'].value)}}</div>\n {{ this.getRemissionsHwfAmount(fee.controls['code'].value) | currency:'GBP':'symbol-narrow':'1.2-2' }}\n </td>\n <td class=\"govuk-table__cell whitespace-inherit left\" *ngIf=\"fee.controls['volume'].value ===1\">\n <input disabled=\"disabled\" class=\"govuk-input govuk-input--width-4 center\" id=\"VolumeUpdated_{{fee.controls['id'].value}}\" name=\"VolumeUpdated_{{fee.controls['id'].value}}\" type=\"text\" value=\"{{fee.controls['volume'].value}}\">\n </td>\n <td class=\"govuk-table__cell whitespace-inherit left\" *ngIf=\"fee.controls['volume'].value >1\">\n <div [formGroupName]=\"i\">\n <input disabled=\"disabled\" class=\"govuk-input govuk-input--width-4 center\" id=\"feeVolumeUpdated_{{fee.controls['id'].value}}\" (keyup)=\"calAmtToRefund($event.target.value,fee.controls['calculated_amount'].value,fee.controls['volume'].value,i)\" value=\"{{fee.controls['updated_volume'].value}}\" name=\"feeVolumeUpdated_{{fee.controls['id'].value}}\" formControlName=\"updated_volume\" type=\"text\" >\n </div>\n </td>\n <td class=\"govuk-table__cell whitespace-inherit center\" scope=\"row\">\n <div [formGroupName]=\"i\" class=\"hmcts-currency-input\">\n <div class=\"hmcts-currency-input__symbol\" aria-hidden=\"true\">\u00A3</div>\n <input disabled=\"disabled\" class=\"govuk-input govuk-input--width-small\" id=\"feeAmount_{{fee.controls['id'].value}}\" name=\"feeAmount_{{fee.controls['id'].value}}\" type=\"text\" aria-describedby=\"amount-currency \" pattern=\"[0-9]*\" formControlName=\"refund_amount\">\n <input id=\"feeVolume_{{fee.controls['id'].value}}\" name=\"feeVolume_{{fee.controls['id'].value}}\" value= \"{{fee.controls['volume'].value}}\" type=\"hidden\" formControlName=\"volume\">\n <input id=\"feeApportionAmount_{{fee.controls['id'].value}}\" name=\"feeApportionAmount_{{fee.controls['id'].value}}\" value= \"{{fee.controls['apportion_amount'].value}}\" type=\"hidden\" formControlName=\"apportion_amount\">\n <input id=\"calculatedAmount_{{fee.controls['id'].value}}\" name=\"calculatedAmount_{{fee.controls['id'].value}}\" value= \"{{fee.controls['calculated_amount'].value}}\" type=\"hidden\" formControlName=\"calculated_amount\">\n </div>\n </td>\n </tr>\n </tbody>\n <tbody class=\"govuk-table__body\" *ngIf=\"isFullyRefund\">\n <tr class=\"govuk-table__row\" *ngFor=\"let fee of fees; let i = index\">\n <td class=\"govuk-table__cell\">\n <div class=\"govuk-checkboxes govuk-checkboxes--large\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input\n class=\"govuk-checkboxes__input\"\n\n id=\"{{fee.id}}\"\n name=\"organisation\"\n type=\"checkbox\"\n value=\"{{fee.id}}\"\n disabled=\"disabled\"\n [checked]=\"true\" >\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"{{fee.id}}\">\n <span style=\"display:none\">{{ \"Select\" | rpxTranslate }}</span>\n </label>\n </div>\n </div>\n </td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ fee.description | rpxTranslate }} </td>\n <td class=\"govuk-table__cell whitespace-inherit left\" >\n <div type=\"hidden\" style=\"display:none;background-color:white;\" id=\"feeVOl_{{fee.id}}\">{{ fee.calculated_amount / fee.volume }}</div>\n {{ fee.calculated_amount / fee.volume| currency:'GBP':'symbol-narrow':'1.2-2' }}\n </td>\n <td class=\"govuk-table__cell whitespace-inherit left\" >{{ payment.amount | currency:'GBP':'symbol-narrow':'1.2-2'}} </td>\n\n <td class=\"govuk-table__cell whitespace-inherit left\" >\n <div type=\"hidden\" style=\"display:none;background-color:white;\" id=\"feeRemission_{{fee.id}}\">{{ this.getRemissionValueForFullyRefund()}}</div>\n {{ this.getRemissionsHwfAmount(fee.code) | currency:'GBP':'symbol-narrow':'1.2-2' }}\n\n </td>\n\n <td class=\"govuk-table__cell whitespace-inherit left\">\n <div >\n <input disabled=\"disabled\" class=\"govuk-input govuk-input--width-4 center\" id=\"feeVolumeUpdated_{{fee.id}}\" value=\"{{fee.volume}}\" name=\"feeVolumeUpdated_{{fee.id}}\" type=\"text\" >\n </div>\n </td>\n\n <td class=\"govuk-table__cell whitespace-inherit center\" scope=\"row\">\n\n <div class=\"hmcts-currency-input\">\n\n <div class=\"hmcts-currency-input__symbol\" aria-hidden=\"true\">\u00A3</div>\n <input disabled=\"disabled\" class=\"govuk-input govuk-input-width-10-left\" id=\"feeAmount_{{fee.id}}\" name=\"feeAmount_{{fee.id}}\" type=\"text\" aria-describedby=\"amount-currency \" value=\"{{ payment.amount}}\" pattern=\"[0-9]*\" >\n </div>\n\n </td>\n </tr>\n </tbody>\n <tbody class=\"govuk-table__body\" *ngIf=\"fees?.length === 0\">\n <td class=\"govuk-table__cell\" colspan=\"6\">{{ \"No fees recorded\" | rpxTranslate }}</td>\n </tbody>\n </table>\n </div>\n <div class=\"govuk-button-group\">\n\n\n <a (click)=\"gotoServiceRequestPage($event)\" *ngIf=\"!isFullyRefund\" draggable=\"false\" class=\"govuk-button govuk-button--secondary\" data-module=\"govuk-button\">\n {{ \"Previous\" | rpxTranslate }}\n </a>\n <a (click)=\"goToPaymentViewComponent()\" *ngIf=\"isFullyRefund\" draggable=\"false\" class=\"govuk-button govuk-button--secondary\" data-module=\"govuk-button\">\n {{ \"Previous\" | rpxTranslate }}\n </a>\n\n <button [disabled] = \"noneSelected()\" (click)=\"gotoIssuePage(isFullyRefund)\" class=\"govuk-button\">\n {{ \"Continue\" | rpxTranslate }}\n </button>\n\n </div>\n <p>\n <a (click)=\"gotoCasetransationPageCancelBtnClicked($event)\" class=\"govuk-link\" data-module=\"govuk-button\">{{ \"Cancel\" | rpxTranslate }}</a>\n </p>\n </form>\n </div>\n</ng-container>\n\n<ng-container *ngIf=\"viewCompStatus === 'issuerefundpage1' && isRefundRemission\">\n\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='ISSUEREFUNDPAGE'>\n <h1 class=\"heading-large\">{{ \"Process refund\" | rpxTranslate }}</h1>\n <h1 class=\"heading-medium\">{{ \"Case reference\" | rpxTranslate }}: {{ccdCaseNumber | ccdHyphens }}</h1>\n <span id=\"how-contacted-conditional-hint govuk-font19px\" *ngIf=\"payment\" class=\"form-hint\">\n {{ \"Payment reference\" | rpxTranslate }}: {{paymentReference}}\n </span>\n <span id=\"how-contacted-conditional-hint govuk-font19px\" *ngIf=\"refundPaymentReference\" class=\"form-hint\">\n {{ \"Payment reference\" | rpxTranslate }}: {{refundPaymentReference}}\n </span>\n <h1 class=\"heading-large\">{{ \"Why are you making this refund\" | rpxTranslate }}?\n </h1>\n\n\n <div class=\"govuk-form-group\">\n <form novalidate>\n <div class=\"govuk-form-group\">\n <form [formGroup]=\"remissionForm\" novalidate>\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"how-contacted-conditional-hint\">\n\n <div\n [ngClass]=\"refundHasError ? 'govuk-radios govuk-radios--conditional form-group-error' : 'govuk-radios govuk-radios--conditional'\"\n data-module=\"govuk-radios\" >\n <p class=\"inline-error-message\" *ngIf=\"refundHasError\">\n <span *ngIf=\"refundHasError\">{{ \"Select a reason why you\u2019re making this refund\" | rpxTranslate }}</span>\n </p>\n\n\n\n <div class = \"container-fluid\">\n <div class=\"row\">\n <div class=\"govuk-radios__item col-md-4\" *ngFor=\"let refund of commonRefundReasons; let i = index;\">\n <!-- <div *ngIf = \"{{refund.name}} !== 'Retrospective remission'\"> -->\n <input class=\"govuk-radios__input\" id=\"{{refund.name}}\" name=\"refundReason\" type=\"radio\"\n formControlName=\"refundReason\" value={{refund.code}}\n (change)=\"selectRadioButton(refund.code, refund.name)\">\n <label class=\"govuk-label--s govuk-radios__label govuk-font__custom\" for=\"how-contacted-conditional\">\n {{refund.name}}\n </label>\n\n <div class=\"govuk-radios__conditional\" *ngIf=\"isRefundReasonsSelected && showReasonText && selectedRefundReason === refund.name \" >\n <label class=\"govuk-label govuk-label--m\" for=\"{{refund.name}}\">\n {{ \"Enter reason\" | rpxTranslate }}\n </label>\n <div [ngClass]=\"{'form-group-error': isReasonEmpty}\">\n <p class=\"inline-error-message\" *ngIf=\"isReasonEmpty\">\n <span *ngIf=\"isReasonEmpty\">{{ \"Enter a reason why you\u2019re making this refund\" | rpxTranslate }}</span>\n </p>\n\n <input class=\"govuk-input govuk-input--width-10\" [ngClass]=\"{'inline-error-class': isReasonEmpty}\" id=\"reason\" aria-label=\"reason\" name=\"reason\" type=\"text\" aria-describedby=\"reason\" maxlength=\"30\" formControlName=\"reason\">\n </div>\n </div>\n <!-- </div> -->\n </div>\n </div>\n </div>\n <br/>\n <div>\n <select formControlName=\"refundDDReason\" class=\"govuk-select\" id=\"sort\" (change)=\"selectchange($event)\">\n <option selected='selected' [defaultSelected]=true [value]=\"default\" >{{default}}</option>\n <!-- <option value=\"\" selected='selected'>Select a different reason</option> -->\n <option *ngFor=\"let refund of refundReasons;\" id=\"{{refund.name}}\" value=\"{{refund.code}}\">{{refund.name}}</option>\n </select>\n\n </div>\n <br/>\n <div class=\"govuk-radios__conditional\" *ngIf=\"showReasonText && !isRefundReasonsSelected\" >\n <div [ngClass]=\"{'form-group-error': isReasonEmpty}\">\n <label class=\"govuk-label govuk-label--m\" for=\"amount\">\n {{ \"Enter reason\" | rpxTranslate }}\n </label>\n <p class=\"inline-error-message\" *ngIf=\"isReasonEmpty\">\n <span *ngIf=\"isReasonEmpty\">{{ \"Enter a reason why you\u2019re making this refund\" | rpxTranslate }}</span>\n </p>\n <input class=\"govuk-input govuk-input--width-10\" [ngClass]=\"{'inline-error-class': isReasonEmpty}\" id=\"reason\" aria-label=\"reason\" name=\"reason\" type=\"text\" aria-describedby=\"reason\" maxlength=\"{{reasonLength}}\" formControlName=\"reason\">\n </div>\n </div>\n\n\n </div>\n </fieldset>\n </form>\n </div>\n </form>\n </div>\n <div class=\"govuk-button-group\">\n <button (click)=\"gotoPartialFeeRefundScreen()\" class=\"govuk-button govuk-button--secondary\"> {{ \"Previous\" | rpxTranslate }}</button>\n <button (click)=\"gotoIssueRefundConfirmation(payment)\" class=\"govuk-button\"> {{ \"Continue\" | rpxTranslate }}</button>\n </div>\n <p>\n <a href=\"javascript:void(0)\" (click)=\"gotoCasetransationPageCancelBtnClicked($event)\" class=\"govuk-link\" data-module=\"govuk-button\">\n {{ \"Cancel\" | rpxTranslate }}\n </a>\n </p>\n\n</ng-container>\n<ng-container *ngIf=\"viewStatus === 'contactDetailsPage'\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='CAPTUREADDRESSDETAILSPAGE'>\n <h1 class=\"govuk-heading-l\">{{ \"Process refund\" | rpxTranslate }}</h1>\n <h2 class=\"govuk-heading-m govuk-font19px\">{{ \"Case reference\" | rpxTranslate }}: {{ccdCaseNumber | ccdHyphens }}</h2>\n <span id=\"how-contacted-conditional-hint\" class=\"govuk-hint govuk-font19px\">\n {{ \"Payment reference\" | rpxTranslate }}: {{paymentReference}}\n </span>\n <ccpay-contact-details\n [addressObj] = notification\n (assignContactDetails)=\"getContactDetails($event, 'checkissuerefundpage')\"\n (redirectToIssueRefund)=\"gotoRefundReasonPage()\" ></ccpay-contact-details>\n <p>\n <a (click)=\"gotoCasetransationPageCancelBtnClicked($event)\" class=\"govuk-link\" data-module=\"govuk-button\">\n {{ \"Cancel\" | rpxTranslate }}\n </a>\n </p>\n\n</ng-container>\n\n<ng-container *ngIf=\"viewStatus === 'checkissuerefundpage'\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='CHECKISSUEREFUNDPAGE'>\n <div class=\"govuk-warning-text\">\n\n <h1 class=\"heading-large\"> {{ \"Check your answers\" | rpxTranslate }}</h1>\n </div>\n <table class=\"govuk-table\">\n\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Payment reference\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{paymentReference}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Payment amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{payment.amount | currency:'GBP':'symbol-narrow':'1.2-2'}}</td>\n </tr>\n <tr>\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Reason for refund\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{ displayRefundReason?.trim() }}\n <a (click)=\"changeIssueRefundReason()\" class=\"govuk-link right\" >{{ \"Change\" | rpxTranslate }}</a>\n </td>\n </tr>\n <tr class=\"govuk-table__row\" *ngIf=\"!isFullyRefund\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Refund amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{totalRefundAmount | currency:'GBP':'symbol-narrow':'1.2-2'}}\n <a (click)=\"changeRefundAmount()\" class=\"govuk-link right\" >{{ \"Change\" | rpxTranslate }}</a>\n </td>\n </tr>\n <tr class=\"govuk-table__row\" *ngIf=\"isFullyRefund\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Refund amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{payment.amount | currency:'GBP':'symbol-narrow':'1.2-2'}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Send to\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{orderParty}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Send via\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">\n <div *ngIf=\"contactDetailsObj?.notification_type === 'EMAIL'\" class=\"contactDetails-width\">\n <strong>{{ \"Email\" | rpxTranslate }}</strong>\n <br/>\n {{contactDetailsObj?.email?.trim()}}\n </div>\n <div *ngIf=\"contactDetailsObj?.notification_type === 'LETTER'\" class=\"contactDetails-width\">\n <strong>{{ \"Post\" | rpxTranslate }}</strong>\n <br/>\n {{contactDetailsObj?.address_line?.trim()}}&nbsp;{{contactDetailsObj?.city?.trim()}}&nbsp;{{contactDetailsObj?.county?.trim()}}&nbsp;{{contactDetailsObj?.country?.trim()}}&nbsp;{{contactDetailsObj?.postal_code?.trim()}}\n </div>\n <a (click)=\"gotoContactDetailsPage(contactDetailsObj)\" class=\"govuk-link right\" >{{ \"Change\" | rpxTranslate }}</a>\n </td>\n </tr>\n\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Notification\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{templateInstructionType}}\n <a *ngIf=\"!notificationPreview\" href=\"Javascript:void(0)\" class=\"govuk-link right\" (click)=\"showNotificationPreview()\">\n {{ \"Preview\" | rpxTranslate }}\n </a>\n <a *ngIf=\"notificationPreview\" href=\"Javascript:void(0)\" class=\"govuk-link right\" (click)=\"hideNotificationPreview()\">\n {{ \"Hide Preview\" | rpxTranslate }}\n </a>\n </td>\n </tr>\n </table>\n\n <app-notification-preview *ngIf=\"notificationPreview\"\n [payment]=\"payment\"\n [contactDetails]=\"contactDetailsObj\"\n [refundReason]=\"selectedRefundReasonCode\"\n [refundAmount]=\"isFullyRefund ? payment.amount : totalRefundAmount\"></app-notification-preview>\n\n\n <div class=\"govuk-button-group\">\n <button type=\"submit\" class=\"button govuk-button--secondary\" (click)=\"gotoContactDetailsPage(contactDetailsObj)\"> {{ \"Previous\" | rpxTranslate }} </button>\n <button type=\"submit\"\n [disabled]=\"isConfirmationBtnDisabled\"\n [ngClass]='isConfirmationBtnDisabled ? \"button button--disabled govuk-!-margin-right-1\" : \"button govuk-!-margin-right-1\"'\n (click)=\"confirmIssueRefund(isFullyRefund)\">\n {{ \"Submit refund\" | rpxTranslate }}\n </button>\n </div>\n <p>\n <a (click)=\"gotoCasetransationPageCancelBtnClicked($event)\" class=\"govuk-link\" data-module=\"govuk-button\">\n {{ \"Cancel\" | rpxTranslate }}\n </a>\n </p>\n\n</ng-container>\n\n<!--Retro Refund-->\n<ng-container *ngIf=\"viewCompStatus === 'addrefundforremission'\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='ADDRESSDETAILSRETROREMISSIONPAGE'>\n <h1 class=\"govuk-heading-l\">{{ \"Process refund\" | rpxTranslate }}</h1>\n <h2 class=\"govuk-heading-m govuk-font19px\">{{ \"Case reference\" | rpxTranslate }}: {{ccdCaseNumber | ccdHyphens }}</h2>\n <span id=\"how-contacted-conditional-hint\" class=\"govuk-hint govuk-font19px\">\n {{ \"Payment reference\" | rpxTranslate }}: {{paymentReference}}\n </span>\n<ccpay-contact-details\n[addressObj] = notification\n(assignContactDetails)=\"getContactDetails($event, 'addrefundcheckandanswer')\"\n(redirectToIssueRefund)=\"gotoServiceRequestPage($event)\" ></ccpay-contact-details>\n<p>\n <a (click)=\"gotoCasetransationPageCancelBtnClicked($event)\" class=\"govuk-link\" data-module=\"govuk-button\">\n {{ \"Cancel\" | rpxTranslate }}\n </a>\n</p>\n</ng-container>\n<ng-container *ngIf=\"viewStatus === 'addrefundcheckandanswer'\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='ADDREFUNDFORREMISSION'>\n <div class=\"govuk-warning-text\">\n\n <h1 class=\"heading-large\"> {{ \"Check your answers\" | rpxTranslate }}</h1>\n </div>\n <table class=\"govuk-table\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Reason for refund\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{ \"Retrospective remission\" | rpxTranslate }}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Payment reference\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{paymentReference}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Refund amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{getRefundAmountToBeDisplayed(remission)| currency:'GBP':'symbol-narrow':'1.2-2'}}</td>\n </tr>\n\n <tr class=\"govuk-table__row\">\n <td *ngIf=\"remessionPayment.status === 'Success'\" class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Remission amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{getRemissionAmountToBeDisplayed(remission)| currency:'GBP':'symbol-narrow':'1.2-2' }}\n </td>\n </tr>\n\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Fee code\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{remission.fee_code}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Fee amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{feeamount | currency:'GBP':'symbol-narrow':'1.2-2'}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Send to\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{orderParty}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Send via\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">\n <div *ngIf=\"contactDetailsObj?.notification_type === 'EMAIL'\" class=\"contactDetails-width\">\n <strong>{{ \"Email\" | rpxTranslate }}</strong>\n <br/>\n {{contactDetailsObj?.email?.trim()}}\n </div>\n <div *ngIf=\"contactDetailsObj?.notification_type === 'LETTER'\" class=\"contactDetails-width\">\n <strong>{{ \"Post\" | rpxTranslate }}</strong>\n <br/>\n {{contactDetailsObj?.address_line?.trim()}}&nbsp;{{contactDetailsObj?.city?.trim()}}&nbsp;{{contactDetailsObj?.county?.trim()}}&nbsp;{{contactDetailsObj?.country?.trim()}}&nbsp;{{contactDetailsObj?.postal_code?.trim()}}\n </div>\n <a (click)=\"gotoAddressPage(contactDetailsObj)\" class=\"govuk-link right\" >{{ \"Change\" | rpxTranslate }}</a>\n </td>\n </tr>\n\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Notification\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{templateInstructionType}}\n <a *ngIf=\"!notificationPreview\" href=\"Javascript:void(0)\" class=\"govuk-link right\" (click)=\"showNotificationPreview()\">\n {{ \"Preview\" | rpxTranslate }}\n </a>\n <a *ngIf=\"notificationPreview\" href=\"Javascript:void(0)\" class=\"govuk-link right\" (click)=\"hideNotificationPreview()\">\n {{ \"Hide Preview\" | rpxTranslate }}\n </a>\n </td>\n </tr>\n </table>\n\n <app-notification-preview *ngIf=\"notificationPreview\"\n [contactDetails]=\"contactDetailsObj\"\n [paymentReference]=\"paymentReference\"\n [payment]=\"paymentObj\"\n [refundReason]=\"'RR036'\"\n [refundAmount]=\"remission.hwf_amount\"></app-notification-preview>\n\n <div class=\"govuk-button-group\">\n <button type=\"submit\" class=\"button govuk-button--secondary\" (click)=\"gotoAddressPage(contactDetailsObj)\">{{ \"Previous\" | rpxTranslate }}</button>\n <button type=\"submit\"\n [disabled]=\"isConfirmationBtnDisabled\"\n [ngClass]='isConfirmationBtnDisabled ? \"button button--disabled govuk-!-margin-right-1\" : \"button govuk-!-margin-right-1\"'\n (click)=\"processRefund()\">\n {{ \"Submit refund\" | rpxTranslate }}\n </button>\n </div>\n <p>\n <a href=\"javascript:void(0)\" (click)=\"gotoCasetransationPageCancelBtnClicked($event)\" class=\"govuk-link\" data-module=\"govuk-button\">\n {{ \"Cancel\" | rpxTranslate }}\n </a>\n </p>\n\n</ng-container>\n\n<ng-container *ngIf=\"viewStatus === 'retrorefundconfirmationpage'\">\n <div class=\"govuk-grid-row\">\n <div >\n <div class=\"govuk-panel govuk-panel--confirmation\">\n <h1 class=\"govuk-panel_remission_title\">\n {{ \"Refund submitted\" | rpxTranslate }}\n </h1>\n\n <div class=\"govuk-panel__body\">\n <p class=\"govuk-body white\"><strong class=\"white\">{{ \"Refund reference\" | rpxTranslate }}: {{refundReference}}</strong></p>\n </div>\n\n </div>\n <div *ngIf=\"isPaymentSuccess\">\n <h2 class=\"govuk-heading-l\">{{ \"What happens next\" | rpxTranslate }}</h2>\n <p class=\"govuk-body\">\n {{ \"A refund request for\" | rpxTranslate }} {{ refundAmount| currency:'GBP':'symbol-narrow':'1.2-2'}} {{ \"has been passed to a team leader to approve\" | rpxTranslate }}.\n </p>\n </div>\n <p class=\"govuk-body\">\n <a href=\"javascript:void(0)\" (click)=\"gotoCasetransationPageCancelBtnClicked($event)\" class=\"govuk-link pointer\" data-module=\"govuk-button\">\n {{ \"Return to case\" | rpxTranslate }}\n </a>\n </p>\n </div>\n </div>\n</ng-container>\n\n<ng-container *ngIf=\"viewStatus === 'order-full-view'\">\n <ccpay-service-request\n [viewStatus] = \"viewStatus\"\n [orderRef] = \"orderRef\"\n [isServiceRequest]=\"isServiceRequest\"\n [orderStatus] = \"orderStatus\"\n [orderCreated] = \"orderCreated\"\n [orderParty] = \"orderParty\"\n [orderCCDEvent] = \"orderCCDEvent\"\n [orderDetail] = \"orderDetail\"\n [LOGGEDINUSERROLES] = \"LOGGEDINUSERROLES\"\n [takePayment] = \"takePayment\"\n [ccdCaseNumber] = \"ccdCaseNumber\"\n [orderFeesTotal] = \"orderFeesTotal\"\n [orderTotalPayments] = \"orderTotalPayments\"\n [orderRemissionTotal] = \"orderRemissionTotal\">\n</ccpay-service-request>\n</ng-container>\n\n<ng-container *ngIf=\"viewStatus === 'payment-view'\">\n <ccpay-payment-view\n [LOGGEDINUSERROLES] = \"LOGGEDINUSERROLES\"\n [isTurnOff] = \"isTurnOff\"\n [isTakePayment] = \"takePayment\"\n [caseType] = \"caseType\"\n [isServiceRequest]=\"isServiceRequest\"\n [orderRef] = \"orderRef\"\n [orderStatus] = \"orderStatus\"\n [orderCreated] = \"orderCreated\"\n [orderParty] = \"orderParty\"\n [orderCCDEvent] = \"orderCCDEvent\"\n [orderDetail] = \"orderDetail\"\n [orderFeesTotal] = \"orderFeesTotal\"\n [orderTotalPayments] = \"orderTotalPayments\"\n [orderRemissionTotal] = \"orderRemissionTotal\"\n >\n</ccpay-payment-view>\n</ng-container>\n\n</div>\n", styles: [".add-remission .button{margin:20px 2px;padding:.5em;font-size:19px;font-weight:200}.add-remission td.govuk-table__cell{width:50%}.add-remission .govuk-button--secondary{background-color:#dee0e2;box-shadow:0 2px #858688;color:#0b0c0c;margin-right:.5em}.add-remission .govuk-warning-text__text,.add-remission .govuk-label--s,.add-remission .label_remission__symbol{font-size:19px;font-weight:400}.add-remission .inline-error-class{outline:3px solid #a71414;outline-offset:0;border-color:#a71414}.add-remission .inline-error-message{color:#a71414;border-color:#a71414;font-weight:700;margin-top:10px;font-size:20px}.add-remission .govuk-button,.add-remission .govuk-link{margin-right:1em;font-size:19px;font-weight:200}.add-remission .govuk-button-group{padding-top:2em}.add-remission .heading-medium{margin-top:.875em}.add-remission .heading-large{margin-top:.25em}.add-remission .govuk-panel--confirmation{color:#fff;background:#00703c}.add-remission .govuk-panel__title{font-size:5rem}.add-remission .govuk-body-m,.add-remission .govuk-body{font-size:2.1875rem}.add-remission .govuk-radios__item{clear:initial!important;display:inline-block;width:45%!important}.add-remission .govuk-radios__conditional{padding-top:12px!important}.add-remission .right{float:right;cursor:pointer}.add-remission .radio{float:right}.govuk-input,.govuk-font19px{font-size:19px}.govuk-select{font-size:19px;font-weight:400}.govuk-input--width-10{max-width:50ex}.govuk-input--width-small{max-width:110px}.govuk-input-width-10-left{max-width:50ex;padding-left:40px}.govuk-label--m{font-size:19px;font-weight:400}.govuk-error-summary__body{font-size:19px!important}.govuk-error-summary__title{font-size:24px!important}.govuk-panel_remission_title{margin-top:0;margin-bottom:30px;color:#fff;font-family:nta,Arial,sans-serif;-webkit-font-smoothing:antialiased;font-weight:700;font-size:48px}.white{color:#fff}.pagesize{margin:2em;width:97%}.pointer{cursor:pointer}.col-18{min-width:18em}.col-6{min-width:6em}.col-8{min-width:8em}.col-1{min-width:1em}.col-25{width:25%!important}.col-24{width:24%!important}.left{text-align:left}.center{text-align:center}.col-60{width:60%;text-align:left}.margin-top--size{margin-top:-30px}.contactDetails-width{width:70%}.right{cursor:pointer}.form-hint{font-size:19px!important}.govuk-panel-border--confirmation{color:#0b0c0c;border:5px solid #00703C}.whitespace-inherit{white-space:inherit!important}.govuk-link{cursor:pointer}.hmcts-currency-input__symbol{font-family:nta,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px;line-height:initial;position:absolute;font-weight:200;padding:8px 10px;height:40px;box-sizing:border-box;background-color:#dee0e2;border:2px solid #0b0c0c}\n"], dependencies: [{ kind: "component", type: i0.forwardRef(() => PaymentViewComponent), selector: "ccpay-payment-view", inputs: ["isTurnOff", "isTakePayment", "caseType", "orderRef", "orderStatus", "orderTotalPayments", "payment", "LOGGEDINUSERROLES", "ISPAYMENTSTATUSENABLED", "orderParty", "orderCreated", "orderCCDEvent", "orderFeesTotal", "orderRemissionTotal", "orderDetail", "isServiceRequest"] }, { kind: "ngmodule", type: i0.forwardRef(() => CommonModule) }, { kind: "directive", type: i0.forwardRef(() => i3.NgClass), selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i0.forwardRef(() => i3.NgForOf), selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i0.forwardRef(() => i3.NgIf), selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i0.forwardRef(() => ServiceRequestComponent), selector: "ccpay-service-request", inputs: ["LOGGEDINUSERROLES", "viewStatus", "orderDetail", "orderRef", "orderStatus", "orderParty", "orderCreated", "orderCCDEvent", "orderFeesTotal", "orderTotalPayments", "orderRemissionTotal", "paymentGroupList", "takePayment", "ccdCaseNumber", "isServiceRequest"], outputs: ["goToServiceRquestComponent"] }, { kind: "component", type: i0.forwardRef(() => NotificationPreviewComponent), selector: "app-notification-preview", inputs: ["payment", "contactDetails", "refundReason", "refundAmount", "paymentReference", "refundReference", "previewJourney", "notificationSent"], outputs: ["notificationPreviewEvent"] }, { kind: "component", type: i0.forwardRef(() => ContactDetailsComponent), selector: "ccpay-contact-details", inputs: ["isEditOperation", "isEditOperationInRefundList", "addressObj"], outputs: ["assignContactDetails", "assignContactDetailsInFefundsList", "redirectToIssueRefund"] }, { kind: "ngmodule", type: i0.forwardRef(() => FormsModule) }, { kind: "directive", type: i0.forwardRef(() => i1$1.ɵNgNoValidate), selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i0.forwardRef(() => i1$1.NgSelectOption), selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i0.forwardRef(() => i1$1.ɵNgSelectMultipleOption), selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i0.forwardRef(() => i1$1.DefaultValueAccessor), selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i0.forwardRef(() => i1$1.NumberValueAccessor), selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i0.forwardRef(() => i1$1.CheckboxControlValueAccessor), selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i0.forwardRef(() => i1$1.SelectControlValueAccessor), selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i0.forwardRef(() => i1$1.RadioControlValueAccessor), selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i0.forwardRef(() => i1$1.NgControlStatus), selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i0.forwardRef(() => i1$1.NgControlStatusGroup), selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i0.forwardRef(() => i1$1.MaxLengthValidator), selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i0.forwardRef(() => i1$1.PatternValidator), selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i0.forwardRef(() => i1$1.NgForm), selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: i0.forwardRef(() => ReactiveFormsModule) }, { kind: "directive", type: i0.forwardRef(() => i1$1.FormGroupDirective), selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i0.forwardRef(() => i1$1.FormControlName), selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i0.forwardRef(() => i1$1.FormGroupName), selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i0.forwardRef(() => i1$1.FormArrayName), selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "ngmodule", type: i0.forwardRef(() => RpxTranslationModule) }, { kind: "pipe", type: i0.forwardRef(() => i3.CurrencyPipe), name: "currency" }, { kind: "pipe", type: i0.forwardRef(() => CcdHyphensPipe), name: "ccdHyphens" }, { kind: "pipe", type: i0.forwardRef(() => i8.RpxTranslatePipe), name: "rpxTranslate" }] });
4583
+ // Summing GBP amounts as floats (e.g. 1789.64 + 387.00) can drift beyond 2dp
4584
+ // (2176.6400000000003), so round the final total before returning it.
4585
+ calculateTotalRefundAmount(feesList) {
4586
+ const totalRefundAmount = feesList.reduce((total, fee) => total + fee.refund_amount * fee.selected, 0);
4587
+ return Number(totalRefundAmount.toFixed(2));
4588
+ }
4589
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: AddRemissionComponent, deps: [{ token: i1$1.FormBuilder }, { token: i1$2.Router }, { token: PaymentViewService }, { token: NotificationService }, { token: 'PAYMENT_LIB' }, { token: RefundsService }, { token: i0.ChangeDetectorRef }, { token: OrderslistService }], target: i0.ɵɵFactoryTarget.Component });
4590
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: AddRemissionComponent, isStandalone: true, selector: "ccpay-add-remission", inputs: { fee: "fee", fees: "fees", payment: "payment", remission: "remission", ccdCaseNumber: "ccdCaseNumber", caseType: "caseType", viewCompStatus: "viewCompStatus", paymentGroupRef: "paymentGroupRef", isTurnOff: "isTurnOff", isRefundRemission: "isRefundRemission", isStrategicFixEnable: "isStrategicFixEnable", paidAmount: "paidAmount", isFromRefundListPage: "isFromRefundListPage", isFromPaymentDetailPage: "isFromPaymentDetailPage", isFromServiceRequestPage: "isFromServiceRequestPage", isFullyRefund: "isFullyRefund", feeamount: "feeamount", refundPaymentReference: "refundPaymentReference", isFromRefundStatusPage: "isFromRefundStatusPage", changeRefundReason: "changeRefundReason", isServiceRequest: "isServiceRequest", LOGGEDINUSERROLES: "LOGGEDINUSERROLES", orderDetail: "orderDetail", orderRef: "orderRef", orderStatus: "orderStatus", orderParty: "orderParty", orderCreated: "orderCreated", orderCCDEvent: "orderCCDEvent", takePayment: ["takepayment", "takePayment"], orderFeesTotal: "orderFeesTotal", orderTotalPayments: "orderTotalPayments", orderRemissionTotal: "orderRemissionTotal" }, outputs: { cancelRemission: "cancelRemission", refundListReason: "refundListReason", refundListAmount: "refundListAmount", refundFees: "refundFees" }, providers: [{ provide: 'ADD_REMISSION', useExisting: AddRemissionComponent }], ngImport: i0, template: "<div class=\"add-remission pagesize\">\n <div *ngIf=\"errorMessage\">\n <div class=\"error-summary\" role=\"group\" aria-labelledby=\"failure-error-summary-heading\" tabindex=\"-1\">\n <h2 class=\"heading-medium error-summary-heading\" id=\"failure-error-summary-heading\">\n {{ \"Error in processing the request\" | rpxTranslate }}\n </h2>\n <div class=\"govuk-error-summary__body\">\n {{ errorMessage | rpxTranslate }}\n </div>\n </div>\n </div>\n <div *ngIf=\"errorMsg.length > 0\">\n <div class=\"error-summary\" role=\"group\" aria-labelledby=\"failure-error-summary-heading\" tabindex=\"-1\">\n <h2 class=\"heading-medium error-summary-heading\" id=\"failure-error-summary-heading\">\n {{ \"Error in processing the request\" | rpxTranslate }}\n </h2>\n <div *ngFor=\"let err of errorMsg; let i = index\" class=\"govuk-error-summary__body\">\n\n <li>{{ err | rpxTranslate }}</li>\n </div>\n </div>\n </div>\n\n<ng-container *ngIf=\"viewStatus === 'main' && !isRefundRemission \">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='ADDREMISSION'>\n <h1 class=\"heading-large\">{{ \"Add remission\" | rpxTranslate }} </h1>\n <form novalidate>\n <div class=\"govuk-form-group\">\n <form [formGroup]=\"remissionForm\" novalidate>\n <div class=\"govuk-form-group\">\n <label class=\"govuk-label govuk-label--s\" for=\"remission-code\">\n {{ \"Add remission to\" | rpxTranslate }} {{ fee?.code }}: {{ fee?.description | rpxTranslate }}\n <span class=\"form-hint\">{{ \"Enter remission for reference\" | rpxTranslate }}. {{ \"For example\" | rpxTranslate }}: HWF-A1B-23C OR PA21-123456</span>\n </label>\n <input [ngClass]=\"{'inline-error-class': isRemissionCodeEmpty || remissionCodeHasError}\" class=\"govuk-input govuk-input--width-20 govuk-!-margin-right-1\" id=\"remissionCode\" aria-label=\"remissionCode\" name=\"remissionCode\" type=\"text\" formControlName=\"remissionCode\">\n <p class=\"inline-error-message\" *ngIf=\"isRemissionCodeEmpty || remissionCodeHasError\">\n <span *ngIf=\"isRemissionCodeEmpty\">{{ \"Enter a remission code\" | rpxTranslate }}</span>\n <span *ngIf=\"remissionCodeHasError\">{{ \"Enter a vaild remission code\" | rpxTranslate }}</span>\n </p>\n </div>\n <div class=\"govuk-form-group\">\n <label class=\"govuk-label govuk-label--s\" for=\"amount\">\n {{ \"How much does the applicant need to pay\" | rpxTranslate }}?\n </label>\n\n <div id=\"amount-currency\" class=\"govuk-visually-hidden\">{{ \"in pounds\" | rpxTranslate }}</div>\n <div class=\"hmcts-currency-input\">\n <div class=\"hmcts-currency-input__symbol\" aria-hidden=\"true\">\u00A3</div>\n <input class=\"govuk-input govuk-input-width-10-left\" [ngClass]=\"{'inline-error-class': isAmountEmpty || amountHasError || isRemissionLessThanFeeError}\" id=\"amount\" aria-label=\"amount\" name=\"amount\" type=\"text\" aria-describedby=\"amount-currency\" formControlName=\"amount\">\n <p class=\"inline-error-message\" *ngIf=\"isAmountEmpty || amountHasError || isRemissionLessThanFeeError\">\n <span *ngIf=\"isAmountEmpty\">{{ \"Enter a amount\" | rpxTranslate }}</span>\n <span *ngIf=\"amountHasError\">{{ \"Enter a vaild amount\" | rpxTranslate }}</span>\n <span *ngIf=\"isRemissionLessThanFeeError\">{{ \"The remission amount must be less than the total fee\" | rpxTranslate }}</span>\n </p>\n </div>\n </div>\n </form>\n <button class=\"button\" type=\"submit\" (click)=\"addRemission()\">\n {{ \"Submit\" | rpxTranslate }}\n </button>\n </div>\n </form>\n</ng-container>\n\n<ng-container *ngIf=\"viewStatus === 'confirmation'\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='ADDREMISSIONCONFIRMATION'>\n <div class=\"govuk-warning-text\">\n <span class=\"govuk-warning-text__icon\" aria-hidden=\"true\">!</span>\n <strong class=\"govuk-warning-text__text\">\n <span class=\"govuk-warning-text__assistive\">{{ \"Warning\" | rpxTranslate }}</span>\n {{ \"Are you sure you want to add remission to this fee\" | rpxTranslate }}?\n </strong>\n </div>\n <table class=\"govuk-table\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Remission code\" | rpxTranslate }}:</td>\n <td class=\"govuk-table__cell\">{{ remissionForm.controls.remissionCode.value }}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Fee code\" | rpxTranslate }}:</td>\n <td class=\"govuk-table__cell\">{{ fee.code }}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Fee description\" | rpxTranslate }}:</td>\n <td class=\"govuk-table__cell\">{{ fee.description | rpxTranslate }}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Amount the applicant must pay\" | rpxTranslate }}:</td>\n <td class=\"govuk-table__cell\">{{ remissionForm.controls.amount.value | currency:'GBP':'symbol-narrow':'1.2-2' }}</td>\n </tr>\n </table>\n\n <button type=\"submit\" class=\"button govuk-button--secondary\" (click)=\"cancelRemission.emit()\">\n {{ \"Cancel\" | rpxTranslate }}\n </button>\n <button type=\"submit\"\n [disabled]=\"isConfirmationBtnDisabled\"\n [ngClass]='isConfirmationBtnDisabled ? \"button button--disabled govuk-!-margin-right-1\" : \"button govuk-!-margin-right-1\"'\n (click)=\"confirmRemission()\">\n {{ \"Confirm\" | rpxTranslate }}\n </button>\n\n</ng-container>\n\n<!-- Add retro remission changes-->\n\n<ng-container *ngIf=\"viewCompStatus === 'addremission'\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='PROCESSADDRETROREMISSIONPAGE'>\n <h1 class=\"heading-large\">{{ \"Process remission\" | rpxTranslate }}</h1>\n <h1 class=\"heading-medium\">#{{ccdCaseNumber | ccdHyphens}}</h1>\n <h1 class=\"heading-large\">{{ \"Enter help with fees or remission reference\" | rpxTranslate }}</h1>\n <form novalidate>\n <div class=\"govuk-form-group\">\n <form [formGroup]=\"remissionForm\" novalidate>\n <div class=\"govuk-form-group\">\n <label class=\"govuk-label govuk-label--s\" for=\"remission-code\">\n <span class=\"form-hint\">{{ \"For example\" | rpxTranslate }}: HWF-A1B-23C OR PA21-123456</span>\n </label>\n <p class=\"inline-error-message\" *ngIf=\"isRemissionCodeEmpty || remissionCodeHasError\">\n <span *ngIf=\"isRemissionCodeEmpty\">{{ \"Enter a remission code\" | rpxTranslate }}</span>\n <span *ngIf=\"remissionCodeHasError\">{{ \"Enter a vaild remission code\" | rpxTranslate }}</span>\n </p>\n <input [ngClass]=\"{'inline-error-class': isRemissionCodeEmpty || remissionCodeHasError}\" class=\"govuk-input govuk-input--width-20 govuk-!-margin-right-1\" id=\"remissionCode\" aria-label=\"remissionCode\" name=\"remissionCode\" type=\"text\" formControlName=\"remissionCode\">\n\n </div>\n\n </form>\n <div class=\"govuk-button-group\">\n <button (click)=\"gotoServiceRequestPage($event)\" class=\"govuk-button govuk-button--secondary\"> {{ \"Previous\" | rpxTranslate }}</button>\n <button (click)=\"addRemissionCode()\" class=\"govuk-button\"> {{ \"Continue\" | rpxTranslate }}</button>\n </div>\n <p><a href=\"javascript:void(0)\" (click)=\"gotoCasetransationPageCancelBtnClicked($event)\" class=\"govuk-link pointer\" data-module=\"govuk-button\">{{ \"Cancel\" | rpxTranslate }}</a></p>\n </div>\n </form>\n\n</ng-container>\n\n<ng-container *ngIf=\"viewStatus === 'processretroremissonpage'\" >\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='PROCESSRETROREMISSIONPAGE'>\n <h1 class=\"heading-large\">{{ \"Process remission\" | rpxTranslate }}</h1>\n <h1 class=\"heading-medium\">#{{ccdCaseNumber | ccdHyphens }}</h1>\n <div class=\"govuk-form-group\">\n <form novalidate>\n <div class=\"govuk-form-group\">\n <form [formGroup]=\"remissionForm\" novalidate>\n <fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">\n <h1 *ngIf=\"remessionPayment?.status === 'Success' || isFromRefundListPage\" class=\"heading-medium\">\n {{ \"Enter the HWF or remission amount\" | rpxTranslate }}\n </h1>\n <h1 *ngIf=\"remessionPayment?.status !== 'Success' && !isFromRefundListPage\" class=\"heading-medium\">\n {{ \"Enter the remission amount\" | rpxTranslate }}\n </h1>\n <h1 *ngIf=\"remessionPayment?.status === 'undefined'\" class=\"heading-medium\">\n {{ \"Enter the amount\" | rpxTranslate }}\n </h1>\n </legend>\n <div id=\"amount-currency\" class=\"govuk-visually-hidden\">{{ \"in pounds\" | rpxTranslate }}</div>\n <p class=\"inline-error-message\" *ngIf=\"isAmountEmpty || amountHasError || isRemissionLessThanFeeError\">\n <span *ngIf=\"isAmountEmpty\">{{ \"Enter a amount\" | rpxTranslate }}</span>\n <span *ngIf=\"amountHasError\">{{ \"Enter a vaild amount\" | rpxTranslate }}</span>\n <span *ngIf=\"isRemissionLessThanFeeError\">{{ \"You cannot add a remission that's more than the fee amount\" | rpxTranslate }}.</span>\n </p>\n <div class=\"hmcts-currency-input\">\n\n <div class=\"hmcts-currency-input__symbol\" aria-hidden=\"true\">\u00A3</div>\n <input class=\"govuk-input govuk-input-width-10-left\" [ngClass]=\"{'inline-error-class': isAmountEmpty || amountHasError || isRemissionLessThanFeeError}\" id=\"amount\" aria-label=\"amount\" name=\"amount\" type=\"number\" aria-describedby=\"amount-currency\" formControlName=\"amount\">\n\n\n </div>\n </fieldset>\n </form>\n\n <div class=\"govuk-button-group\">\n <button (click)=\"gotoAddRetroRemissionCodePage()\" class=\"govuk-button govuk-button--secondary\"> {{ \"Previous\" | rpxTranslate }}</button>\n <button (click)=\"gotoCheckRetroRemissionPage(payment)\" class=\"govuk-button\"> {{ \"Continue\" | rpxTranslate }}</button>\n\n </div>\n <p>\n <a href=\"javascript:void(0)\" (click)=\"gotoCasetransationPageCancelBtnClicked($event)\" class=\"govuk-link\" data-module=\"govuk-button\">{{ \"Cancel\" | rpxTranslate }}</a>\n </p>\n </div>\n\n </form>\n </div>\n</ng-container>\n<ng-container *ngIf=\"viewStatus === 'checkretroremissionpage'\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='CHECKRETROREMISSIONCONFIRMATION'>\n <div class=\"govuk-warning-text\">\n <h1 class=\"heading-large\"> {{ \"Check your answers\" | rpxTranslate }}</h1>\n </div>\n <table class=\"govuk-table\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Payment reference\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{remessionPayment ? remessionPayment.reference: ' '}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Payment amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">\u00A3{{ remessionPayment ? getFormattedCurrency(remessionPayment.amount): ' ' | currency :'GBP':'symbol':'1.2-2'}} </td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Payment status\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{remessionPayment ? remessionPayment.status: ''}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Fee\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{ fee.code }} - {{ fee.description | rpxTranslate }} </td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Fee amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{ fee.calculated_amount/fee.volume| currency:'GBP':'symbol-narrow':'1.2-2' }}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Help with fees or remission reference\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{ remissionForm.controls.remissionCode.value?.trim() }}\n <a (click)=\"gotoProcessRetroRemissionPage()\" class=\"govuk-link right\" >{{ \"Change\" | rpxTranslate }}</a>\n </td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Remission amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{remissionForm.controls.amount.value | currency:'GBP':'symbol-narrow':'1.2-2' }}\n <a (click)=\"gotoAmountRetroRemission()\" class=\"govuk-link right\" >{{ \"Change\" | rpxTranslate }}</a>\n </td>\n </tr>\n </table>\n\n <button type=\"submit\" class=\"button govuk-button--secondary\" (click)=\"gotoAmountRetroRemission()\">{{ \"Previous\" | rpxTranslate }}</button>\n <button type=\"submit\" [disabled]=\"isConfirmationBtnDisabled\" [ngClass]='isConfirmationBtnDisabled ? \"button button--disabled govuk-!-margin-right-1\" : \"button govuk-!-margin-right-1\"' (click)=\"confirmRetroRemission()\"> {{ \"Add remission\" | rpxTranslate }} </button>\n <p> <a href=\"javascript:void(0)\" (click)=\"gotoCasetransationPageCancelBtnClicked($event)\" class=\"govuk-link\" data-module=\"govuk-button\"> {{ \"Cancel\" | rpxTranslate }}</a> </p>\n\n</ng-container>\n\n<ng-container *ngIf=\"viewStatus === 'retroremissionconfirmationpage'\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='RETROREMISSIONCONFIRMATIONPAGE'>\n <div class=\"govuk-grid-row\">\n <div >\n <div class=\"govuk-panel govuk-panel-border--confirmation\">\n <h1 class=\"govuk-panel__title\">\n {{ \"Remission added\" | rpxTranslate }}\n </h1>\n <div *ngIf=\"remessionPayment.status === 'Success'\" class=\"govuk-panel__body\">\n <p class=\"govuk-body\"><strong>{{ \"The amount to be refunded should be\" | rpxTranslate }} {{remissionForm.controls.amount.value | currency:'GBP':'symbol-narrow':'1.2-2' }}</strong></p>\n\n </div>\n </div>\n <div *ngIf=\"remessionPayment.status === 'Success'\" >\n <button type=\"submit\" [disabled]=\"!canRefundBeApplied()\" [ngClass]='isConfirmationBtnDisabled ? \"button button--disabled govuk-!-margin-right-1\" : \"button govuk-!-margin-right-1\"' (click)=\"gotoProcessRetroRemission()\">{{ \"Continue\" | rpxTranslate }} </button>\n </div>\n <p class=\"govuk-body\">\n <a href=\"javascript:void(0)\" (click)=\"gotoCasetransationPageCancelBtnClicked($event)\" class=\"govuk-link pointer\" data-module=\"govuk-button\">\n {{ \"Return to case\" | rpxTranslate }}\n </a>\n </p>\n </div>\n </div>\n</ng-container>\n\n\n<ng-container *ngIf=\"viewStatus === 'remissionAddressPage'\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='ADDRESSDETAILSRETROREMISSIONPAGE'>\n <h1 class=\"govuk-heading-l\">{{ \"Process refund\" | rpxTranslate }}</h1>\n <h2 class=\"govuk-heading-m govuk-font19px\">{{ \"Case reference\" | rpxTranslate }}: {{ccdCaseNumber | ccdHyphens }}</h2>\n <ccpay-contact-details\n [addressObj] = notification\n (assignContactDetails)=\"getContactDetails($event, 'checkaddRefundpage')\"\n (redirectToIssueRefund)=\"gotoRemissionSuccess($event)\" ></ccpay-contact-details>\n <p>\n <a (click)=\"gotoCasetransationPageCancelBtnClicked($event)\" class=\"govuk-link\" data-module=\"govuk-button\">\n {{ \"Cancel\" | rpxTranslate }}\n </a>\n </p>\n\n</ng-container>\n\n<ng-container *ngIf=\"viewStatus === 'checkaddRefundpage'\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='CHECKRETROREMISSIONCONFIRMATION'>\n <div class=\"govuk-warning-text\">\n <h1 class=\"heading-large\"> {{ \"Check your answers\" | rpxTranslate }}</h1>\n </div>\n <table class=\"govuk-table\">\n\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Reason for refund\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{ \"Retrospective remission\" | rpxTranslate }}</td>\n </tr>\n\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Payment reference\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{remessionPayment ? remessionPayment.reference: ' '}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Payment amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">\u00A3{{ remessionPayment ? getFormattedCurrency(remessionPayment.amount): ' ' | currency :'GBP':'symbol':'1.2-2'}} </td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Payment status\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{remessionPayment ? remessionPayment.status: '' | rpxTranslate}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Fee\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{ fee.code }} - {{ fee.description | rpxTranslate }} ({{ fee.calculated_amount/fee.volume| currency:'GBP':'symbol-narrow':'1.2-2' }}) </td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Help with fees or remission reference\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{ remissionForm.controls.remissionCode.value?.trim() }}\n </td>\n </tr>\n\n <tr class=\"govuk-table__row\">\n <td *ngIf=\"remessionPayment.status === 'Success'\" class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Remission amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{remissionForm.controls.amount.value | currency:'GBP':'symbol-narrow':'1.2-2' }}\n </td>\n </tr>\n\n <tr class=\"govuk-table__row\">\n <td *ngIf=\"remessionPayment.status === 'Success'\" class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Refund amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{ getRefundAmountToBeDisplayedForContinueJourney()| currency:'GBP':'symbol-narrow':'1.2-2' }}\n </td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Send to\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{orderParty}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Send via\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">\n <div *ngIf=\"contactDetailsObj?.notification_type === 'EMAIL'\" class=\"contactDetails-width\">\n <strong>{{ \"Email\" | rpxTranslate }}</strong>\n <br/>\n {{contactDetailsObj?.email?.trim()}}\n </div>\n <div *ngIf=\"contactDetailsObj?.notification_type === 'LETTER'\" class=\"contactDetails-width\">\n <strong>{{ \"Post\" | rpxTranslate }}</strong>\n <br/>\n {{contactDetailsObj?.address_line?.trim()}}&nbsp;{{contactDetailsObj?.city?.trim()}}&nbsp;{{contactDetailsObj?.county?.trim()}}&nbsp;{{contactDetailsObj?.country?.trim()}}&nbsp;{{contactDetailsObj?.postal_code?.trim()}}\n </div>\n <a (click)=\"gotoProcessRetroRemission(contactDetailsObj)\" class=\"govuk-link right\" >{{ \"Change\" | rpxTranslate }}</a>\n </td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Notification\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{templateInstructionType}}\n <a *ngIf=\"!notificationPreview\" href=\"Javascript:void(0)\" class=\"govuk-link right\" (click)=\"showNotificationPreview()\">\n {{ \"Preview\" | rpxTranslate }}\n </a>\n <a *ngIf=\"notificationPreview\" href=\"Javascript:void(0)\" class=\"govuk-link right\" (click)=\"hideNotificationPreview()\">\n {{ \"Hide Preview\" | rpxTranslate }}\n </a>\n </td>\n </tr>\n </table>\n\n <app-notification-preview *ngIf=\"notificationPreview\"\n [payment]=\"remessionPayment\"\n [contactDetails]=\"contactDetailsObj\"\n [refundReason]=\"'RR036'\"\n [refundAmount]=\"remissionForm.controls.amount.value\"></app-notification-preview>\n\n <button type=\"submit\" class=\"button govuk-button--secondary\" (click)=\"gotoProcessRetroRemission(contactDetailsObj)\">{{ \"Previous\" | rpxTranslate }}</button>\n <button type=\"submit\" [disabled]=\"isConfirmationBtnDisabled\" [ngClass]='isConfirmationBtnDisabled ? \"button button--disabled govuk-!-margin-right-1\" : \"button govuk-!-margin-right-1\"' (click)=\"processRefund()\"> {{ \"Submit refund\" | rpxTranslate }} </button>\n <p> <a href=\"javascript:void(0)\" (click)=\"gotoCasetransationPageCancelBtnClicked($event)\" class=\"govuk-link\" data-module=\"govuk-button\"> {{ \"Cancel\" | rpxTranslate }}</a> </p>\n\n</ng-container>\n\n<ng-container *ngIf=\"viewStatus === 'refundconfirmationpage'\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='RETROREMISSIONREFUNDCONFIRMATIONPAGE'>\n <div class=\"govuk-grid-row\">\n <div >\n <div class=\"govuk-panel govuk-panel--confirmation\">\n <h1 class=\"govuk-panel_remission_title\">\n {{ \"Refund submitted\" | rpxTranslate }}\n </h1>\n\n <div class=\"govuk-panel__body\">\n <p class=\"govuk-body white\"><strong class=\"white\">{{ \"Refund reference\" | rpxTranslate }}: {{refundReference}}</strong></p>\n </div>\n\n </div>\n <div *ngIf=\"isPaymentSuccess\">\n <h2 class=\"govuk-heading-l\">{{ \"What happens next\" | rpxTranslate }}</h2>\n <p class=\"govuk-body\">\n {{ \"A refund request for\" | rpxTranslate }} {{refundAmount | currency:'GBP':'symbol-narrow':'1.2-2' }} {{ \"has been created and will be passed to a team leader to approve\" | rpxTranslate }}.\n </p>\n </div>\n <p class=\"govuk-body\">\n <a href=\"javascript:void(0)\" (click)=\"gotoCasetransationPageCancelBtnClicked($event)\" class=\"govuk-link pointer\" data-module=\"govuk-button\">\n {{ \"Return to case\" | rpxTranslate }}\n </a>\n </p>\n </div>\n </div>\n\n</ng-container>\n\n<!-- Issue Refund Section -->\n<ng-container *ngIf=\"viewCompStatus === 'issuerefund' && isRefundRemission\">\n <div class=\"govuk-form-group\">\n <form [formGroup]=\"remissionForm\" novalidate>\n <h1 class=\"heading-large\">{{ \"Process refund\" | rpxTranslate }}</h1>\n <h2 class=\"heading-medium\">{{ \"Case reference\" | rpxTranslate }}:{{ccdCaseNumber | ccdHyphens }}</h2>\n <span id=\"how-contacted-conditional-hint\" class=\"form-hint govuk-font19px\">\n {{ \"Payment reference\" | rpxTranslate }}: {{paymentReference}}\n </span>\n <h3 class=\"heading-small\">{{ \"Select fees to be refunded\" | rpxTranslate }}</h3>\n <!--TABLE-->\n <div>\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header col-1\" scope=\"col\">{{ \"Select\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-18\" scope=\"col\">{{ \"Fee description\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-6\" scope=\"col\">{{ \"Fee amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-6\" scope=\"col\">{{ \"Total paid\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-6\" scope=\"col\">{{ \"Remission amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-6\" scope=\"col\">{{ \"Quantity\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-8\" scope=\"col\">{{ \"Amount to refund\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header\" scope=\"col\"></td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\" *ngIf=\"!isFullyRefund\">\n <tr class=\"govuk-table__row\" formArrayName=\"feesList\" *ngFor=\"let fee of feesList?.controls; let i = index\">\n <td class=\"govuk-table__cell\">\n <div [formGroupName]=\"i\" class=\"govuk-checkboxes govuk-checkboxes--large\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input\n class=\"govuk-checkboxes__input\"\n (click)=\"check_en(i,fee.controls['id'].value,fee.controls['apportion_amount'].value,fee.controls['volume'].value)\"\n id=\"{{fee.controls['id'].value}}\"\n name=\"organisation\"\n type=\"checkbox\"\n value=\"{{fee.controls['id'].value}}\"\n formControlName=\"selected\" >\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"{{fee.controls['id'].value}}\">\n <span style=\"display:none\">{{ \"Select\" | rpxTranslate }}</span>\n </label>\n </div>\n </div>\n </td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{fee.controls['description'].value}} </td>\n <td class=\"govuk-table__cell whitespace-inherit left\" >\n <div type=\"hidden\" style=\"display:none;background-color:white;\" id=\"feeVOl_{{fee.controls['id'].value}}\">{{ fee.controls['calculated_amount'].value / fee.controls['volume'].value }}</div>\n {{ fee.controls['calculated_amount'].value / fee.controls['volume'].value | currency:'GBP':'symbol-narrow':'1.2-2' }}\n </td>\n <td class=\"govuk-table__cell whitespace-inherit left\" >{{ fee.controls['apportion_amount'].value | currency:'GBP':'symbol-narrow':'1.2-2'}} </td>\n <td class=\"govuk-table__cell whitespace-inherit left\" >\n <div type=\"hidden\" style=\"display:none;background-color:white;\" id=\"feeVOl_{{fee.controls['id'].value}}\">{{ this.getRemissionsHwfAmount(fee.controls['code'].value)}}</div>\n {{ this.getRemissionsHwfAmount(fee.controls['code'].value) | currency:'GBP':'symbol-narrow':'1.2-2' }}\n </td>\n <td class=\"govuk-table__cell whitespace-inherit left\" *ngIf=\"fee.controls['volume'].value ===1\">\n <input disabled=\"disabled\" class=\"govuk-input govuk-input--width-4 center\" id=\"VolumeUpdated_{{fee.controls['id'].value}}\" name=\"VolumeUpdated_{{fee.controls['id'].value}}\" type=\"text\" value=\"{{fee.controls['volume'].value}}\">\n </td>\n <td class=\"govuk-table__cell whitespace-inherit left\" *ngIf=\"fee.controls['volume'].value >1\">\n <div [formGroupName]=\"i\">\n <input disabled=\"disabled\" class=\"govuk-input govuk-input--width-4 center\" id=\"feeVolumeUpdated_{{fee.controls['id'].value}}\" (keyup)=\"calAmtToRefund($event.target.value,fee.controls['calculated_amount'].value,fee.controls['volume'].value,i)\" value=\"{{fee.controls['updated_volume'].value}}\" name=\"feeVolumeUpdated_{{fee.controls['id'].value}}\" formControlName=\"updated_volume\" type=\"text\" >\n </div>\n </td>\n <td class=\"govuk-table__cell whitespace-inherit center\" scope=\"row\">\n <div [formGroupName]=\"i\" class=\"hmcts-currency-input\">\n <div class=\"hmcts-currency-input__symbol\" aria-hidden=\"true\">\u00A3</div>\n <input disabled=\"disabled\" class=\"govuk-input govuk-input--width-small\" id=\"feeAmount_{{fee.controls['id'].value}}\" name=\"feeAmount_{{fee.controls['id'].value}}\" type=\"text\" aria-describedby=\"amount-currency \" pattern=\"[0-9]*\" formControlName=\"refund_amount\">\n <input id=\"feeVolume_{{fee.controls['id'].value}}\" name=\"feeVolume_{{fee.controls['id'].value}}\" value= \"{{fee.controls['volume'].value}}\" type=\"hidden\" formControlName=\"volume\">\n <input id=\"feeApportionAmount_{{fee.controls['id'].value}}\" name=\"feeApportionAmount_{{fee.controls['id'].value}}\" value= \"{{fee.controls['apportion_amount'].value}}\" type=\"hidden\" formControlName=\"apportion_amount\">\n <input id=\"calculatedAmount_{{fee.controls['id'].value}}\" name=\"calculatedAmount_{{fee.controls['id'].value}}\" value= \"{{fee.controls['calculated_amount'].value}}\" type=\"hidden\" formControlName=\"calculated_amount\">\n </div>\n </td>\n </tr>\n </tbody>\n <tbody class=\"govuk-table__body\" *ngIf=\"isFullyRefund\">\n <tr class=\"govuk-table__row\" *ngFor=\"let fee of fees; let i = index\">\n <td class=\"govuk-table__cell\">\n <div class=\"govuk-checkboxes govuk-checkboxes--large\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input\n class=\"govuk-checkboxes__input\"\n\n id=\"{{fee.id}}\"\n name=\"organisation\"\n type=\"checkbox\"\n value=\"{{fee.id}}\"\n disabled=\"disabled\"\n [checked]=\"true\" >\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"{{fee.id}}\">\n <span style=\"display:none\">{{ \"Select\" | rpxTranslate }}</span>\n </label>\n </div>\n </div>\n </td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ fee.description | rpxTranslate }} </td>\n <td class=\"govuk-table__cell whitespace-inherit left\" >\n <div type=\"hidden\" style=\"display:none;background-color:white;\" id=\"feeVOl_{{fee.id}}\">{{ fee.calculated_amount / fee.volume }}</div>\n {{ fee.calculated_amount / fee.volume| currency:'GBP':'symbol-narrow':'1.2-2' }}\n </td>\n <td class=\"govuk-table__cell whitespace-inherit left\" >{{ payment.amount | currency:'GBP':'symbol-narrow':'1.2-2'}} </td>\n\n <td class=\"govuk-table__cell whitespace-inherit left\" >\n <div type=\"hidden\" style=\"display:none;background-color:white;\" id=\"feeRemission_{{fee.id}}\">{{ this.getRemissionValueForFullyRefund()}}</div>\n {{ this.getRemissionsHwfAmount(fee.code) | currency:'GBP':'symbol-narrow':'1.2-2' }}\n\n </td>\n\n <td class=\"govuk-table__cell whitespace-inherit left\">\n <div >\n <input disabled=\"disabled\" class=\"govuk-input govuk-input--width-4 center\" id=\"feeVolumeUpdated_{{fee.id}}\" value=\"{{fee.volume}}\" name=\"feeVolumeUpdated_{{fee.id}}\" type=\"text\" >\n </div>\n </td>\n\n <td class=\"govuk-table__cell whitespace-inherit center\" scope=\"row\">\n\n <div class=\"hmcts-currency-input\">\n\n <div class=\"hmcts-currency-input__symbol\" aria-hidden=\"true\">\u00A3</div>\n <input disabled=\"disabled\" class=\"govuk-input govuk-input-width-10-left\" id=\"feeAmount_{{fee.id}}\" name=\"feeAmount_{{fee.id}}\" type=\"text\" aria-describedby=\"amount-currency \" value=\"{{ payment.amount}}\" pattern=\"[0-9]*\" >\n </div>\n\n </td>\n </tr>\n </tbody>\n <tbody class=\"govuk-table__body\" *ngIf=\"fees?.length === 0\">\n <td class=\"govuk-table__cell\" colspan=\"6\">{{ \"No fees recorded\" | rpxTranslate }}</td>\n </tbody>\n </table>\n </div>\n <div class=\"govuk-button-group\">\n\n\n <a (click)=\"gotoServiceRequestPage($event)\" *ngIf=\"!isFullyRefund\" draggable=\"false\" class=\"govuk-button govuk-button--secondary\" data-module=\"govuk-button\">\n {{ \"Previous\" | rpxTranslate }}\n </a>\n <a (click)=\"goToPaymentViewComponent()\" *ngIf=\"isFullyRefund\" draggable=\"false\" class=\"govuk-button govuk-button--secondary\" data-module=\"govuk-button\">\n {{ \"Previous\" | rpxTranslate }}\n </a>\n\n <button [disabled] = \"noneSelected()\" (click)=\"gotoIssuePage(isFullyRefund)\" class=\"govuk-button\">\n {{ \"Continue\" | rpxTranslate }}\n </button>\n\n </div>\n <p>\n <a (click)=\"gotoCasetransationPageCancelBtnClicked($event)\" class=\"govuk-link\" data-module=\"govuk-button\">{{ \"Cancel\" | rpxTranslate }}</a>\n </p>\n </form>\n </div>\n</ng-container>\n\n<ng-container *ngIf=\"viewCompStatus === 'issuerefundpage1' && isRefundRemission\">\n\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='ISSUEREFUNDPAGE'>\n <h1 class=\"heading-large\">{{ \"Process refund\" | rpxTranslate }}</h1>\n <h1 class=\"heading-medium\">{{ \"Case reference\" | rpxTranslate }}: {{ccdCaseNumber | ccdHyphens }}</h1>\n <span id=\"how-contacted-conditional-hint govuk-font19px\" *ngIf=\"payment\" class=\"form-hint\">\n {{ \"Payment reference\" | rpxTranslate }}: {{paymentReference}}\n </span>\n <span id=\"how-contacted-conditional-hint govuk-font19px\" *ngIf=\"refundPaymentReference\" class=\"form-hint\">\n {{ \"Payment reference\" | rpxTranslate }}: {{refundPaymentReference}}\n </span>\n <h1 class=\"heading-large\">{{ \"Why are you making this refund\" | rpxTranslate }}?\n </h1>\n\n\n <div class=\"govuk-form-group\">\n <form novalidate>\n <div class=\"govuk-form-group\">\n <form [formGroup]=\"remissionForm\" novalidate>\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"how-contacted-conditional-hint\">\n\n <div\n [ngClass]=\"refundHasError ? 'govuk-radios govuk-radios--conditional form-group-error' : 'govuk-radios govuk-radios--conditional'\"\n data-module=\"govuk-radios\" >\n <p class=\"inline-error-message\" *ngIf=\"refundHasError\">\n <span *ngIf=\"refundHasError\">{{ \"Select a reason why you\u2019re making this refund\" | rpxTranslate }}</span>\n </p>\n\n\n\n <div class = \"container-fluid\">\n <div class=\"row\">\n <div class=\"govuk-radios__item col-md-4\" *ngFor=\"let refund of commonRefundReasons; let i = index;\">\n <!-- <div *ngIf = \"{{refund.name}} !== 'Retrospective remission'\"> -->\n <input class=\"govuk-radios__input\" id=\"{{refund.name}}\" name=\"refundReason\" type=\"radio\"\n formControlName=\"refundReason\" value={{refund.code}}\n (change)=\"selectRadioButton(refund.code, refund.name)\">\n <label class=\"govuk-label--s govuk-radios__label govuk-font__custom\" for=\"how-contacted-conditional\">\n {{refund.name}}\n </label>\n\n <div class=\"govuk-radios__conditional\" *ngIf=\"isRefundReasonsSelected && showReasonText && selectedRefundReason === refund.name \" >\n <label class=\"govuk-label govuk-label--m\" for=\"{{refund.name}}\">\n {{ \"Enter reason\" | rpxTranslate }}\n </label>\n <div [ngClass]=\"{'form-group-error': isReasonEmpty}\">\n <p class=\"inline-error-message\" *ngIf=\"isReasonEmpty\">\n <span *ngIf=\"isReasonEmpty\">{{ \"Enter a reason why you\u2019re making this refund\" | rpxTranslate }}</span>\n </p>\n\n <input class=\"govuk-input govuk-input--width-10\" [ngClass]=\"{'inline-error-class': isReasonEmpty}\" id=\"reason\" aria-label=\"reason\" name=\"reason\" type=\"text\" aria-describedby=\"reason\" maxlength=\"30\" formControlName=\"reason\">\n </div>\n </div>\n <!-- </div> -->\n </div>\n </div>\n </div>\n <br/>\n <div>\n <select formControlName=\"refundDDReason\" class=\"govuk-select\" id=\"sort\" (change)=\"selectchange($event)\">\n <option selected='selected' [defaultSelected]=true [value]=\"default\" >{{default}}</option>\n <!-- <option value=\"\" selected='selected'>Select a different reason</option> -->\n <option *ngFor=\"let refund of refundReasons;\" id=\"{{refund.name}}\" value=\"{{refund.code}}\">{{refund.name}}</option>\n </select>\n\n </div>\n <br/>\n <div class=\"govuk-radios__conditional\" *ngIf=\"showReasonText && !isRefundReasonsSelected\" >\n <div [ngClass]=\"{'form-group-error': isReasonEmpty}\">\n <label class=\"govuk-label govuk-label--m\" for=\"amount\">\n {{ \"Enter reason\" | rpxTranslate }}\n </label>\n <p class=\"inline-error-message\" *ngIf=\"isReasonEmpty\">\n <span *ngIf=\"isReasonEmpty\">{{ \"Enter a reason why you\u2019re making this refund\" | rpxTranslate }}</span>\n </p>\n <input class=\"govuk-input govuk-input--width-10\" [ngClass]=\"{'inline-error-class': isReasonEmpty}\" id=\"reason\" aria-label=\"reason\" name=\"reason\" type=\"text\" aria-describedby=\"reason\" maxlength=\"{{reasonLength}}\" formControlName=\"reason\">\n </div>\n </div>\n\n\n </div>\n </fieldset>\n </form>\n </div>\n </form>\n </div>\n <div class=\"govuk-button-group\">\n <button (click)=\"gotoPartialFeeRefundScreen()\" class=\"govuk-button govuk-button--secondary\"> {{ \"Previous\" | rpxTranslate }}</button>\n <button (click)=\"gotoIssueRefundConfirmation(payment)\" class=\"govuk-button\"> {{ \"Continue\" | rpxTranslate }}</button>\n </div>\n <p>\n <a href=\"javascript:void(0)\" (click)=\"gotoCasetransationPageCancelBtnClicked($event)\" class=\"govuk-link\" data-module=\"govuk-button\">\n {{ \"Cancel\" | rpxTranslate }}\n </a>\n </p>\n\n</ng-container>\n<ng-container *ngIf=\"viewStatus === 'contactDetailsPage'\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='CAPTUREADDRESSDETAILSPAGE'>\n <h1 class=\"govuk-heading-l\">{{ \"Process refund\" | rpxTranslate }}</h1>\n <h2 class=\"govuk-heading-m govuk-font19px\">{{ \"Case reference\" | rpxTranslate }}: {{ccdCaseNumber | ccdHyphens }}</h2>\n <span id=\"how-contacted-conditional-hint\" class=\"govuk-hint govuk-font19px\">\n {{ \"Payment reference\" | rpxTranslate }}: {{paymentReference}}\n </span>\n <ccpay-contact-details\n [addressObj] = notification\n (assignContactDetails)=\"getContactDetails($event, 'checkissuerefundpage')\"\n (redirectToIssueRefund)=\"gotoRefundReasonPage()\" ></ccpay-contact-details>\n <p>\n <a (click)=\"gotoCasetransationPageCancelBtnClicked($event)\" class=\"govuk-link\" data-module=\"govuk-button\">\n {{ \"Cancel\" | rpxTranslate }}\n </a>\n </p>\n\n</ng-container>\n\n<ng-container *ngIf=\"viewStatus === 'checkissuerefundpage'\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='CHECKISSUEREFUNDPAGE'>\n <div class=\"govuk-warning-text\">\n\n <h1 class=\"heading-large\"> {{ \"Check your answers\" | rpxTranslate }}</h1>\n </div>\n <table class=\"govuk-table\">\n\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Payment reference\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{paymentReference}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Payment amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{payment.amount | currency:'GBP':'symbol-narrow':'1.2-2'}}</td>\n </tr>\n <tr>\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Reason for refund\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{ displayRefundReason?.trim() }}\n <a (click)=\"changeIssueRefundReason()\" class=\"govuk-link right\" >{{ \"Change\" | rpxTranslate }}</a>\n </td>\n </tr>\n <tr class=\"govuk-table__row\" *ngIf=\"!isFullyRefund\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Refund amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{totalRefundAmount | currency:'GBP':'symbol-narrow':'1.2-2'}}\n <a (click)=\"changeRefundAmount()\" class=\"govuk-link right\" >{{ \"Change\" | rpxTranslate }}</a>\n </td>\n </tr>\n <tr class=\"govuk-table__row\" *ngIf=\"isFullyRefund\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Refund amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{payment.amount | currency:'GBP':'symbol-narrow':'1.2-2'}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Send to\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{orderParty}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Send via\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">\n <div *ngIf=\"contactDetailsObj?.notification_type === 'EMAIL'\" class=\"contactDetails-width\">\n <strong>{{ \"Email\" | rpxTranslate }}</strong>\n <br/>\n {{contactDetailsObj?.email?.trim()}}\n </div>\n <div *ngIf=\"contactDetailsObj?.notification_type === 'LETTER'\" class=\"contactDetails-width\">\n <strong>{{ \"Post\" | rpxTranslate }}</strong>\n <br/>\n {{contactDetailsObj?.address_line?.trim()}}&nbsp;{{contactDetailsObj?.city?.trim()}}&nbsp;{{contactDetailsObj?.county?.trim()}}&nbsp;{{contactDetailsObj?.country?.trim()}}&nbsp;{{contactDetailsObj?.postal_code?.trim()}}\n </div>\n <a (click)=\"gotoContactDetailsPage(contactDetailsObj)\" class=\"govuk-link right\" >{{ \"Change\" | rpxTranslate }}</a>\n </td>\n </tr>\n\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Notification\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{templateInstructionType}}\n <a *ngIf=\"!notificationPreview\" href=\"Javascript:void(0)\" class=\"govuk-link right\" (click)=\"showNotificationPreview()\">\n {{ \"Preview\" | rpxTranslate }}\n </a>\n <a *ngIf=\"notificationPreview\" href=\"Javascript:void(0)\" class=\"govuk-link right\" (click)=\"hideNotificationPreview()\">\n {{ \"Hide Preview\" | rpxTranslate }}\n </a>\n </td>\n </tr>\n </table>\n\n <app-notification-preview *ngIf=\"notificationPreview\"\n [payment]=\"payment\"\n [contactDetails]=\"contactDetailsObj\"\n [refundReason]=\"selectedRefundReasonCode\"\n [refundAmount]=\"isFullyRefund ? payment.amount : totalRefundAmount\"></app-notification-preview>\n\n\n <div class=\"govuk-button-group\">\n <button type=\"submit\" class=\"button govuk-button--secondary\" (click)=\"gotoContactDetailsPage(contactDetailsObj)\"> {{ \"Previous\" | rpxTranslate }} </button>\n <button type=\"submit\"\n [disabled]=\"isConfirmationBtnDisabled\"\n [ngClass]='isConfirmationBtnDisabled ? \"button button--disabled govuk-!-margin-right-1\" : \"button govuk-!-margin-right-1\"'\n (click)=\"confirmIssueRefund(isFullyRefund)\">\n {{ \"Submit refund\" | rpxTranslate }}\n </button>\n </div>\n <p>\n <a (click)=\"gotoCasetransationPageCancelBtnClicked($event)\" class=\"govuk-link\" data-module=\"govuk-button\">\n {{ \"Cancel\" | rpxTranslate }}\n </a>\n </p>\n\n</ng-container>\n\n<!--Retro Refund-->\n<ng-container *ngIf=\"viewCompStatus === 'addrefundforremission'\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='ADDRESSDETAILSRETROREMISSIONPAGE'>\n <h1 class=\"govuk-heading-l\">{{ \"Process refund\" | rpxTranslate }}</h1>\n <h2 class=\"govuk-heading-m govuk-font19px\">{{ \"Case reference\" | rpxTranslate }}: {{ccdCaseNumber | ccdHyphens }}</h2>\n <span id=\"how-contacted-conditional-hint\" class=\"govuk-hint govuk-font19px\">\n {{ \"Payment reference\" | rpxTranslate }}: {{paymentReference}}\n </span>\n<ccpay-contact-details\n[addressObj] = notification\n(assignContactDetails)=\"getContactDetails($event, 'addrefundcheckandanswer')\"\n(redirectToIssueRefund)=\"gotoServiceRequestPage($event)\" ></ccpay-contact-details>\n<p>\n <a (click)=\"gotoCasetransationPageCancelBtnClicked($event)\" class=\"govuk-link\" data-module=\"govuk-button\">\n {{ \"Cancel\" | rpxTranslate }}\n </a>\n</p>\n</ng-container>\n<ng-container *ngIf=\"viewStatus === 'addrefundcheckandanswer'\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='ADDREFUNDFORREMISSION'>\n <div class=\"govuk-warning-text\">\n\n <h1 class=\"heading-large\"> {{ \"Check your answers\" | rpxTranslate }}</h1>\n </div>\n <table class=\"govuk-table\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Reason for refund\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{ \"Retrospective remission\" | rpxTranslate }}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Payment reference\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{paymentReference}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Refund amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{getRefundAmountToBeDisplayed(remission)| currency:'GBP':'symbol-narrow':'1.2-2'}}</td>\n </tr>\n\n <tr class=\"govuk-table__row\">\n <td *ngIf=\"remessionPayment.status === 'Success'\" class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Remission amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{getRemissionAmountToBeDisplayed(remission)| currency:'GBP':'symbol-narrow':'1.2-2' }}\n </td>\n </tr>\n\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Fee code\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{remission.fee_code}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Fee amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{feeamount | currency:'GBP':'symbol-narrow':'1.2-2'}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Send to\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{orderParty}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Send via\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">\n <div *ngIf=\"contactDetailsObj?.notification_type === 'EMAIL'\" class=\"contactDetails-width\">\n <strong>{{ \"Email\" | rpxTranslate }}</strong>\n <br/>\n {{contactDetailsObj?.email?.trim()}}\n </div>\n <div *ngIf=\"contactDetailsObj?.notification_type === 'LETTER'\" class=\"contactDetails-width\">\n <strong>{{ \"Post\" | rpxTranslate }}</strong>\n <br/>\n {{contactDetailsObj?.address_line?.trim()}}&nbsp;{{contactDetailsObj?.city?.trim()}}&nbsp;{{contactDetailsObj?.county?.trim()}}&nbsp;{{contactDetailsObj?.country?.trim()}}&nbsp;{{contactDetailsObj?.postal_code?.trim()}}\n </div>\n <a (click)=\"gotoAddressPage(contactDetailsObj)\" class=\"govuk-link right\" >{{ \"Change\" | rpxTranslate }}</a>\n </td>\n </tr>\n\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Notification\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{templateInstructionType}}\n <a *ngIf=\"!notificationPreview\" href=\"Javascript:void(0)\" class=\"govuk-link right\" (click)=\"showNotificationPreview()\">\n {{ \"Preview\" | rpxTranslate }}\n </a>\n <a *ngIf=\"notificationPreview\" href=\"Javascript:void(0)\" class=\"govuk-link right\" (click)=\"hideNotificationPreview()\">\n {{ \"Hide Preview\" | rpxTranslate }}\n </a>\n </td>\n </tr>\n </table>\n\n <app-notification-preview *ngIf=\"notificationPreview\"\n [contactDetails]=\"contactDetailsObj\"\n [paymentReference]=\"paymentReference\"\n [payment]=\"paymentObj\"\n [refundReason]=\"'RR036'\"\n [refundAmount]=\"remission.hwf_amount\"></app-notification-preview>\n\n <div class=\"govuk-button-group\">\n <button type=\"submit\" class=\"button govuk-button--secondary\" (click)=\"gotoAddressPage(contactDetailsObj)\">{{ \"Previous\" | rpxTranslate }}</button>\n <button type=\"submit\"\n [disabled]=\"isConfirmationBtnDisabled\"\n [ngClass]='isConfirmationBtnDisabled ? \"button button--disabled govuk-!-margin-right-1\" : \"button govuk-!-margin-right-1\"'\n (click)=\"processRefund()\">\n {{ \"Submit refund\" | rpxTranslate }}\n </button>\n </div>\n <p>\n <a href=\"javascript:void(0)\" (click)=\"gotoCasetransationPageCancelBtnClicked($event)\" class=\"govuk-link\" data-module=\"govuk-button\">\n {{ \"Cancel\" | rpxTranslate }}\n </a>\n </p>\n\n</ng-container>\n\n<ng-container *ngIf=\"viewStatus === 'retrorefundconfirmationpage'\">\n <div class=\"govuk-grid-row\">\n <div >\n <div class=\"govuk-panel govuk-panel--confirmation\">\n <h1 class=\"govuk-panel_remission_title\">\n {{ \"Refund submitted\" | rpxTranslate }}\n </h1>\n\n <div class=\"govuk-panel__body\">\n <p class=\"govuk-body white\"><strong class=\"white\">{{ \"Refund reference\" | rpxTranslate }}: {{refundReference}}</strong></p>\n </div>\n\n </div>\n <div *ngIf=\"isPaymentSuccess\">\n <h2 class=\"govuk-heading-l\">{{ \"What happens next\" | rpxTranslate }}</h2>\n <p class=\"govuk-body\">\n {{ \"A refund request for\" | rpxTranslate }} {{ refundAmount| currency:'GBP':'symbol-narrow':'1.2-2'}} {{ \"has been passed to a team leader to approve\" | rpxTranslate }}.\n </p>\n </div>\n <p class=\"govuk-body\">\n <a href=\"javascript:void(0)\" (click)=\"gotoCasetransationPageCancelBtnClicked($event)\" class=\"govuk-link pointer\" data-module=\"govuk-button\">\n {{ \"Return to case\" | rpxTranslate }}\n </a>\n </p>\n </div>\n </div>\n</ng-container>\n\n<ng-container *ngIf=\"viewStatus === 'order-full-view'\">\n <ccpay-service-request\n [viewStatus] = \"viewStatus\"\n [orderRef] = \"orderRef\"\n [isServiceRequest]=\"isServiceRequest\"\n [orderStatus] = \"orderStatus\"\n [orderCreated] = \"orderCreated\"\n [orderParty] = \"orderParty\"\n [orderCCDEvent] = \"orderCCDEvent\"\n [orderDetail] = \"orderDetail\"\n [LOGGEDINUSERROLES] = \"LOGGEDINUSERROLES\"\n [takePayment] = \"takePayment\"\n [ccdCaseNumber] = \"ccdCaseNumber\"\n [orderFeesTotal] = \"orderFeesTotal\"\n [orderTotalPayments] = \"orderTotalPayments\"\n [orderRemissionTotal] = \"orderRemissionTotal\">\n</ccpay-service-request>\n</ng-container>\n\n<ng-container *ngIf=\"viewStatus === 'payment-view'\">\n <ccpay-payment-view\n [LOGGEDINUSERROLES] = \"LOGGEDINUSERROLES\"\n [isTurnOff] = \"isTurnOff\"\n [isTakePayment] = \"takePayment\"\n [caseType] = \"caseType\"\n [isServiceRequest]=\"isServiceRequest\"\n [orderRef] = \"orderRef\"\n [orderStatus] = \"orderStatus\"\n [orderCreated] = \"orderCreated\"\n [orderParty] = \"orderParty\"\n [orderCCDEvent] = \"orderCCDEvent\"\n [orderDetail] = \"orderDetail\"\n [orderFeesTotal] = \"orderFeesTotal\"\n [orderTotalPayments] = \"orderTotalPayments\"\n [orderRemissionTotal] = \"orderRemissionTotal\"\n >\n</ccpay-payment-view>\n</ng-container>\n\n</div>\n", styles: [".add-remission .button{margin:20px 2px;padding:.5em;font-size:19px;font-weight:200}.add-remission td.govuk-table__cell{width:50%}.add-remission .govuk-button--secondary{background-color:#dee0e2;box-shadow:0 2px #858688;color:#0b0c0c;margin-right:.5em}.add-remission .govuk-warning-text__text,.add-remission .govuk-label--s,.add-remission .label_remission__symbol{font-size:19px;font-weight:400}.add-remission .inline-error-class{outline:3px solid #a71414;outline-offset:0;border-color:#a71414}.add-remission .inline-error-message{color:#a71414;border-color:#a71414;font-weight:700;margin-top:10px;font-size:20px}.add-remission .govuk-button,.add-remission .govuk-link{margin-right:1em;font-size:19px;font-weight:200}.add-remission .govuk-button-group{padding-top:2em}.add-remission .heading-medium{margin-top:.875em}.add-remission .heading-large{margin-top:.25em}.add-remission .govuk-panel--confirmation{color:#fff;background:#00703c}.add-remission .govuk-panel__title{font-size:5rem}.add-remission .govuk-body-m,.add-remission .govuk-body{font-size:2.1875rem}.add-remission .govuk-radios__item{clear:initial!important;display:inline-block;width:45%!important}.add-remission .govuk-radios__conditional{padding-top:12px!important}.add-remission .right{float:right;cursor:pointer}.add-remission .radio{float:right}.govuk-input,.govuk-font19px{font-size:19px}.govuk-select{font-size:19px;font-weight:400}.govuk-input--width-10{max-width:50ex}.govuk-input--width-small{max-width:110px}.govuk-input-width-10-left{max-width:50ex;padding-left:40px}.govuk-label--m{font-size:19px;font-weight:400}.govuk-error-summary__body{font-size:19px!important}.govuk-error-summary__title{font-size:24px!important}.govuk-panel_remission_title{margin-top:0;margin-bottom:30px;color:#fff;font-family:nta,Arial,sans-serif;-webkit-font-smoothing:antialiased;font-weight:700;font-size:48px}.white{color:#fff}.pagesize{margin:2em;width:97%}.pointer{cursor:pointer}.col-18{min-width:18em}.col-6{min-width:6em}.col-8{min-width:8em}.col-1{min-width:1em}.col-25{width:25%!important}.col-24{width:24%!important}.left{text-align:left}.center{text-align:center}.col-60{width:60%;text-align:left}.margin-top--size{margin-top:-30px}.contactDetails-width{width:70%}.right{cursor:pointer}.form-hint{font-size:19px!important}.govuk-panel-border--confirmation{color:#0b0c0c;border:5px solid #00703C}.whitespace-inherit{white-space:inherit!important}.govuk-link{cursor:pointer}.hmcts-currency-input__symbol{font-family:nta,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px;line-height:initial;position:absolute;font-weight:200;padding:8px 10px;height:40px;box-sizing:border-box;background-color:#dee0e2;border:2px solid #0b0c0c}\n"], dependencies: [{ kind: "component", type: i0.forwardRef(() => PaymentViewComponent), selector: "ccpay-payment-view", inputs: ["isTurnOff", "isTakePayment", "caseType", "orderRef", "orderStatus", "orderTotalPayments", "payment", "LOGGEDINUSERROLES", "ISPAYMENTSTATUSENABLED", "orderParty", "orderCreated", "orderCCDEvent", "orderFeesTotal", "orderRemissionTotal", "orderDetail", "isServiceRequest"] }, { kind: "ngmodule", type: i0.forwardRef(() => CommonModule) }, { kind: "directive", type: i0.forwardRef(() => i3.NgClass), selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i0.forwardRef(() => i3.NgForOf), selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i0.forwardRef(() => i3.NgIf), selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i0.forwardRef(() => ServiceRequestComponent), selector: "ccpay-service-request", inputs: ["LOGGEDINUSERROLES", "viewStatus", "orderDetail", "orderRef", "orderStatus", "orderParty", "orderCreated", "orderCCDEvent", "orderFeesTotal", "orderTotalPayments", "orderRemissionTotal", "paymentGroupList", "takePayment", "ccdCaseNumber", "isServiceRequest"], outputs: ["goToServiceRquestComponent"] }, { kind: "component", type: i0.forwardRef(() => NotificationPreviewComponent), selector: "app-notification-preview", inputs: ["payment", "contactDetails", "refundReason", "refundAmount", "paymentReference", "refundReference", "previewJourney", "notificationSent"], outputs: ["notificationPreviewEvent"] }, { kind: "component", type: i0.forwardRef(() => ContactDetailsComponent), selector: "ccpay-contact-details", inputs: ["isEditOperation", "isEditOperationInRefundList", "addressObj"], outputs: ["assignContactDetails", "assignContactDetailsInFefundsList", "redirectToIssueRefund"] }, { kind: "ngmodule", type: i0.forwardRef(() => FormsModule) }, { kind: "directive", type: i0.forwardRef(() => i1$1.ɵNgNoValidate), selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i0.forwardRef(() => i1$1.NgSelectOption), selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i0.forwardRef(() => i1$1.ɵNgSelectMultipleOption), selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i0.forwardRef(() => i1$1.DefaultValueAccessor), selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i0.forwardRef(() => i1$1.NumberValueAccessor), selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i0.forwardRef(() => i1$1.CheckboxControlValueAccessor), selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i0.forwardRef(() => i1$1.SelectControlValueAccessor), selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i0.forwardRef(() => i1$1.RadioControlValueAccessor), selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i0.forwardRef(() => i1$1.NgControlStatus), selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i0.forwardRef(() => i1$1.NgControlStatusGroup), selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i0.forwardRef(() => i1$1.MaxLengthValidator), selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i0.forwardRef(() => i1$1.PatternValidator), selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i0.forwardRef(() => i1$1.NgForm), selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: i0.forwardRef(() => ReactiveFormsModule) }, { kind: "directive", type: i0.forwardRef(() => i1$1.FormGroupDirective), selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i0.forwardRef(() => i1$1.FormControlName), selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i0.forwardRef(() => i1$1.FormGroupName), selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i0.forwardRef(() => i1$1.FormArrayName), selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "ngmodule", type: i0.forwardRef(() => RpxTranslationModule) }, { kind: "pipe", type: i0.forwardRef(() => i3.CurrencyPipe), name: "currency" }, { kind: "pipe", type: i0.forwardRef(() => CcdHyphensPipe), name: "ccdHyphens" }, { kind: "pipe", type: i0.forwardRef(() => i8.RpxTranslatePipe), name: "rpxTranslate" }] });
4577
4591
  }
4578
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: AddRemissionComponent, decorators: [{
4592
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: AddRemissionComponent, decorators: [{
4579
4593
  type: Component,
4580
4594
  args: [{ selector: 'ccpay-add-remission', providers: [{ provide: 'ADD_REMISSION', useExisting: AddRemissionComponent }], imports: [
4581
4595
  forwardRef(() => PaymentViewComponent),
@@ -4699,10 +4713,10 @@ class StatusHistoryService {
4699
4713
  })
4700
4714
  .pipe(catchError(this.errorHandlerService.handleError));
4701
4715
  }
4702
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: StatusHistoryService, deps: [{ token: i1.HttpClient }, { token: LoggerService }, { token: ErrorHandlerService }, { token: PaymentLibService }], target: i0.ɵɵFactoryTarget.Injectable });
4703
- static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: StatusHistoryService, providedIn: 'root' });
4716
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: StatusHistoryService, deps: [{ token: i1.HttpClient }, { token: LoggerService }, { token: ErrorHandlerService }, { token: PaymentLibService }], target: i0.ɵɵFactoryTarget.Injectable });
4717
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: StatusHistoryService, providedIn: 'root' });
4704
4718
  }
4705
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: StatusHistoryService, decorators: [{
4719
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: StatusHistoryService, decorators: [{
4706
4720
  type: Injectable,
4707
4721
  args: [{
4708
4722
  providedIn: 'root'
@@ -4723,10 +4737,10 @@ class StatusHistoryComponent {
4723
4737
  ngOnInit() {
4724
4738
  this.statusHistoryService.getPaymentStatusesByReference(this.paymentLibComponent.paymentReference, this.paymentLibComponent.paymentMethod).subscribe(statuses => this.statuses = statuses, (error) => this.errorMessage = error.replace(/"/g, ""));
4725
4739
  }
4726
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: StatusHistoryComponent, deps: [{ token: StatusHistoryService }, { token: 'PAYMENT_LIB' }], target: i0.ɵɵFactoryTarget.Component });
4727
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.1", type: StatusHistoryComponent, isStandalone: true, selector: "ccpay-payment-statuses", inputs: { isTakePayment: "isTakePayment" }, ngImport: i0, template: "<div class=\"column\">\n <h2 class=\"heading-medium\">{{ pageTitle }}</h2>\n</div>\n\n\n<div class=\"error-summary\" role=\"group\" aria-labelledby=\"failure-error-summary-heading\" tabindex=\"-1\" *ngIf=\"errorMessage\">\n <h2 class=\"heading-medium error-summary-heading\" id=\"failure-error-summary-heading\">\n Payment status history could not be retrieved\n </h2>\n <div class=\"govuk-error-summary__body\">\n {{ errorMessage }}\n </div>\n</div>\n\n<div *ngIf=\"!errorMessage && statuses\">\n <table>\n <thead>\n <tr>\n <th>Status</th>\n <th *ngIf=\"isTakePayment\">Amount</th>\n <th>Date and time</th>\n </tr>\n </thead> \n <tbody>\n <tr *ngFor=\"let status of statuses.status_histories\">\n <td>{{ status.status }}</td>\n <td *ngIf=\"isTakePayment\">\u00A3{{ statuses.amount | number:'.2' }}</td>\n <td>{{ status.date_created | date:'dd MMMM yyyy HH:mm:ss'}}</td>\n </tr>\n </tbody>\n </table>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i3.DecimalPipe, name: "number" }, { kind: "pipe", type: i3.DatePipe, name: "date" }] });
4740
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: StatusHistoryComponent, deps: [{ token: StatusHistoryService }, { token: 'PAYMENT_LIB' }], target: i0.ɵɵFactoryTarget.Component });
4741
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: StatusHistoryComponent, isStandalone: true, selector: "ccpay-payment-statuses", inputs: { isTakePayment: "isTakePayment" }, ngImport: i0, template: "<div class=\"column\">\n <h2 class=\"heading-medium\">{{ pageTitle }}</h2>\n</div>\n\n\n<div class=\"error-summary\" role=\"group\" aria-labelledby=\"failure-error-summary-heading\" tabindex=\"-1\" *ngIf=\"errorMessage\">\n <h2 class=\"heading-medium error-summary-heading\" id=\"failure-error-summary-heading\">\n Payment status history could not be retrieved\n </h2>\n <div class=\"govuk-error-summary__body\">\n {{ errorMessage }}\n </div>\n</div>\n\n<div *ngIf=\"!errorMessage && statuses\">\n <table>\n <thead>\n <tr>\n <th>Status</th>\n <th *ngIf=\"isTakePayment\">Amount</th>\n <th>Date and time</th>\n </tr>\n </thead> \n <tbody>\n <tr *ngFor=\"let status of statuses.status_histories\">\n <td>{{ status.status }}</td>\n <td *ngIf=\"isTakePayment\">\u00A3{{ statuses.amount | number:'.2' }}</td>\n <td>{{ status.date_created | date:'dd MMMM yyyy HH:mm:ss'}}</td>\n </tr>\n </tbody>\n </table>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i3.DecimalPipe, name: "number" }, { kind: "pipe", type: i3.DatePipe, name: "date" }] });
4728
4742
  }
4729
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: StatusHistoryComponent, decorators: [{
4743
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: StatusHistoryComponent, decorators: [{
4730
4744
  type: Component,
4731
4745
  args: [{ selector: 'ccpay-payment-statuses', imports: [CommonModule], standalone: true, template: "<div class=\"column\">\n <h2 class=\"heading-medium\">{{ pageTitle }}</h2>\n</div>\n\n\n<div class=\"error-summary\" role=\"group\" aria-labelledby=\"failure-error-summary-heading\" tabindex=\"-1\" *ngIf=\"errorMessage\">\n <h2 class=\"heading-medium error-summary-heading\" id=\"failure-error-summary-heading\">\n Payment status history could not be retrieved\n </h2>\n <div class=\"govuk-error-summary__body\">\n {{ errorMessage }}\n </div>\n</div>\n\n<div *ngIf=\"!errorMessage && statuses\">\n <table>\n <thead>\n <tr>\n <th>Status</th>\n <th *ngIf=\"isTakePayment\">Amount</th>\n <th>Date and time</th>\n </tr>\n </thead> \n <tbody>\n <tr *ngFor=\"let status of statuses.status_histories\">\n <td>{{ status.status }}</td>\n <td *ngIf=\"isTakePayment\">\u00A3{{ statuses.amount | number:'.2' }}</td>\n <td>{{ status.date_created | date:'dd MMMM yyyy HH:mm:ss'}}</td>\n </tr>\n </tbody>\n </table>\n</div>\n" }]
4732
4746
  }], ctorParameters: () => [{ type: StatusHistoryService }, { type: undefined, decorators: [{
@@ -5131,10 +5145,10 @@ class PaymentViewComponent {
5131
5145
  hideNotificationPreview() {
5132
5146
  this.notificationPreview = false;
5133
5147
  }
5134
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: PaymentViewComponent, deps: [{ token: PaymentViewService }, { token: NotificationService }, { token: 'PAYMENT_LIB' }, { token: i0.ChangeDetectorRef }, { token: OrderslistService }], target: i0.ɵɵFactoryTarget.Component });
5135
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.1", type: PaymentViewComponent, isStandalone: true, selector: "ccpay-payment-view", inputs: { isTurnOff: "isTurnOff", isTakePayment: "isTakePayment", caseType: "caseType", orderRef: "orderRef", orderStatus: "orderStatus", orderTotalPayments: "orderTotalPayments", payment: "payment", LOGGEDINUSERROLES: "LOGGEDINUSERROLES", ISPAYMENTSTATUSENABLED: "ISPAYMENTSTATUSENABLED", orderParty: "orderParty", orderCreated: "orderCreated", orderCCDEvent: "orderCCDEvent", orderFeesTotal: "orderFeesTotal", orderRemissionTotal: "orderRemissionTotal", orderDetail: "orderDetail", isServiceRequest: "isServiceRequest" }, providers: [{ provide: 'PAYMENT_VIEW', useExisting: forwardRef(() => PaymentViewComponent) }], ngImport: i0, template: "<div class=\"payment-view-section\">\n<ng-container *ngIf=\"viewStatus === 'paymentview' && viewCompStatus !== 'overpayment' && viewCompStatus !== 'overPaymentAddressCapture' && viewCompStatus !== 'overpaymentcheckandanswer'\">\n<div class=\"govuk-width-container\">\n\n <div class=\"govuk-breadcrumbs\">\n <ol class=\"govuk-breadcrumbs__list\">\n <li class=\"govuk-breadcrumbs__list-item\">\n <a href=\"javascript:void(0)\" (click)=\"goToCaseTransationPage($event)\" class=\"govuk-back-link\">{{ \"Back\" | rpxTranslate }}</a>\n </li>\n </ol>\n </div>\n\n <main class=\"govuk-main-wrapper govuk-!-padding-top-0\" id=\"main-content\" role=\"main\">\n\n <div *ngIf=\"errorMessage\">\n <div class=\"error-summary\" role=\"group\" aria-labelledby=\"failure-error-summary-heading\" tabindex=\"-1\">\n <h2 class=\"heading-medium error-summary-heading\" id=\"failure-error-summary-heading\">\n {{ \"Payment details could not be retrieved\" | rpxTranslate }}\n </h2>\n <div class=\"govuk-error-summary__body\">\n {{ errorMessage | rpxTranslate }}\n </div>\n </div>\n </div>\n\n <div class=\"payment-view-alignment\" *ngIf=\"!errorMessage && paymentGroup?.payments[0]\">\n\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='PAYMENTDETAILS'>\n <div class=\"govuk-grid-row\">\n <div class=\"column\">\n <h1 class=\"heading-large govuk-!-margin-top-0\">{{ \"Payment details\" | rpxTranslate }}</h1>\n </div>\n </div>\n <table>\n <tbody>\n\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">{{ \"Service request reference\" | rpxTranslate }}</td>\n <td class=\"tb-col-w\">{{ serviceReference }}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">{{ \"Payment reference\" | rpxTranslate }}</td>\n <td class=\"tb-col-w\">{{ paymentGroup?.payments[0]?.reference }}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">{{ \"Payment amount\" | rpxTranslate }}</td>\n <td class=\"tb-col-w\">\u00A3{{ paymentGroup?.payments[0]?.amount | number:'.2' }}</td>\n </tr>\n <tr class=\"section\" *ngIf=\"paymentGroup?.payments[0]?.over_payment > 0\">\n <td class=\"bold tb-col-w\">{{ \"Over payment\" | rpxTranslate }}</td>\n <td class=\"tb-col-w\">\u00A3{{ getOverPaymentValue() | number:'.2' }}</td>\n </tr>\n <tr class=\"section\" *ngIf=\"paymentGroup?.payments[0] && paymentGroup?.payments[0]?.document_control_number && !paymentGroup?.payments[0]?.external_reference\">\n <td class=\"bold tb-col-w\">{{ \"Payment asset number\" | rpxTranslate}}(DCN)</td>\n <td class=\"tb-col-w\">{{ paymentGroup?.payments[0]?.document_control_number }}</td>\n </tr>\n <tr class=\"section\" *ngIf=\"paymentGroup?.payments[0] && paymentGroup?.payments[0]?.document_control_number && !paymentGroup?.payments[0]?.external_reference\">\n <td class=\"bold tb-col-w\">{{ \"Banked date\" | rpxTranslate }}</td>\n <td class=\"tb-col-w\">{{ paymentGroup?.payments[0]?.banked_date | date:'dd MMM yyyy' }}</td>\n </tr>\n <tr class=\"section\" *ngIf=\"paymentGroup?.payments[0] && paymentGroup?.payments[0]?.external_reference\">\n <td class=\"bold tb-col-w\">{{ \"GovPay Transaction ID\" | rpxTranslate: {gov: \"GovPay\", id: \"ID\"} }}</td>\n <td class=\"tb-col-w\">{{ paymentGroup?.payments[0]?.external_reference }}</td>\n </tr>\n <tr class=\"section\" >\n <td class=\"bold tb-col-w\">{{ \"Payment method\" | rpxTranslate }}</td>\n <td class=\"tb-col-w text-transform\">{{ paymentGroup?.payments[0]?.method | rpxTranslate }}</td>\n </tr>\n <tr class=\"section\" *ngIf=\"paymentGroup?.payments[0]?.method === 'payment by account'\" >\n <td class=\"bold tb-col-w\">{{ \"Type\" | rpxTranslate }}</td>\n <td class=\"tb-col-w\" *ngIf=\"paymentGroup?.payments[0]?.method !== 'card'\">{{ \"Credit\" | rpxTranslate }}</td>\n <td class=\"tb-col-w\" *ngIf=\"paymentGroup?.payments[0]?.method === 'card'\">{{ \"Card\" | rpxTranslate }}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">{{ \"Channel\" | rpxTranslate }}</td>\n <td class=\"tb-col-w text-transform\">{{ paymentGroup?.payments[0]?.channel | rpxTranslate }}</td>\n </tr>\n <!-- <tr class=\"section\">\n <td class=\"bold tb-col-w\">Method</td>\n <td *ngIf=\"paymentGroup?.payments[0]?.method !== 'card'\">{{ paymentGroup?.payments[0]?.method }}</td>\n <td *ngIf=\"paymentGroup?.payments[0]?.method === 'card'\">CARD</td>\n </tr> -->\n <!-- <tr class=\"section\" *ngIf=\"paymentGroup?.payments[0]?.channel !== 'telephony'\">\n <td class=\"bold tb-col-w\">Status</td>\n <td>{{ paymentGroup?.payments[0]?.status }}</td>\n </tr> -->\n <tr class=\"section\" *ngIf=\"paymentGroup?.payments[0]?.payment_allocation[0] !== undefined\">\n <td class=\"bold tb-col-w\">{{ \"Allocaton status\" | rpxTranslate }}</td>\n <td class=\"tb-col-w\">{{ paymentGroup?.payments[0]?.payment_allocation[0]?.allocation_status | rpxTranslate }}</td>\n </tr>\n\n <tr *ngIf=\"paymentGroup?.payments[0].organisation_name\">\n <td class=\"bold tb-col-w\">{{ \"PBA account name\" | rpxTranslate: {pba: \"PBA\"} }}</td>\n <td class=\"tb-col-w\">{{ paymentGroup?.payments[0]?.organisation_name }}</td>\n </tr>\n\n <tr *ngIf=\"paymentGroup?.payments[0].account_number\">\n <td class=\"bold tb-col-w\">PBA {{ \"number\" | rpxTranslate }}</td>\n <td class=\"tb-col-w\">{{ paymentGroup?.payments[0]?.account_number }}</td>\n </tr>\n\n <tr *ngIf=\"paymentGroup?.payments[0].customer_reference\">\n <td class=\"bold tb-col-w\">{{ \"Customer internal reference\" | rpxTranslate }}</td>\n <td class=\"tb-col-w\">{{ paymentGroup?.payments[0]?.customer_reference }}</td>\n </tr>\n\n </tbody>\n </table>\n\n <div>\n <!-- Status histories -->\n <ccpay-payment-statuses *ngIf=\"isStatusAllocated\" [isTakePayment]=\"isTakePayment\"></ccpay-payment-statuses>\n </div>\n <div class=\"remission\">\n <button [disabled]=\"!chkIsIssueRefundBtnEnable(paymentGroup?.payments[0])\" (click)=\"issueRefund(paymentGroup)\" class=\"govuk-button govuk-button--secondary\">{{ \"Issue refund\" | rpxTranslate }}</button>\n </div>\n<div *ngIf=\"ISPAYMENTSTATUSENABLED\">\n <div class=\"column\">\n <h2 class=\"heading-medium\">{{ \"Disputed payment history\" | rpxTranslate }}</h2>\n </div>\n \n <div>\n <table>\n <thead>\n <tr>\n <th>{{ \"Status\" | rpxTranslate }}</th>\n <th>{{ \"Amount\" | rpxTranslate }}</th>\n <th>{{ \"Date\" | rpxTranslate }}</th>\n <th>{{ \"Payment reference\" | rpxTranslate }}</th>\n <th>{{ \"Event\" | rpxTranslate }}</th>\n <th></th>\n </tr>\n </thead> \n <tbody *ngIf=\"!errorMsg && allPaymentsFailure.length > 0\">\n <tr *ngFor=\"let payment of allPaymentsFailure\">\n <td>{{ payment.status | capitalize | rpxTranslate }}</td>\n <td>\u00A3{{ payment.disputed_amount | number:'.2' }}</td>\n <td>{{(payment.representment_date ? payment.representment_date : payment.failure_event_date_time) | date:'dd MMM yyyy'}}</td>\n <td>{{ payment.payment_reference }}</td>\n <td >{{ payment.failure_type | rpxTranslate }}</td>\n <td>\n \n <a href=\"javascript:void(0)\" (click)=\"goToPaymentFailuePage(payment)\">{{ \"Show detail\" | rpxTranslate }}</a>\n\n </td>\n </tr>\n </tbody>\n <tbody *ngIf=\"errorMsg || allPaymentsFailure.length === 0\">\n <tr>\n <td colspan=\"6\"> {{ \"No disputed payment history available.\" | rpxTranslate }} </td>\n </tr>\n </tbody>\n </table>\n </div>\n <br/>\n <br/>\n </div>\n \n <div *ngIf=\"checkForFees(paymentGroup)\">\n <div *ngIf=\"paymentGroup.fees.length > 0\">\n <div class=\"column\">\n <br/>\n <br/>\n <h2 class=\"heading-large\">{{ \"Fee and remission details\" | rpxTranslate }}</h2>\n\n </div>\n </div>\n\n <div *ngFor=\"let fee of paymentGroup.fees\">\n <table class=\"table\">\n <tbody>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">{{ \"Description\" | rpxTranslate }}</td>\n <td class=\"tb-col-w\">{{ \"Application for\" | rpxTranslate }} {{ fee.description | rpxTranslate }}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">{{ \"Fee code\" | rpxTranslate }}</td>\n <td class=\"tb-col-w\">{{ fee?.code }}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\" [ngClass]=\"{'tr-border': !fee.apportion_amount && !fee.remissions && !isTurnOff }\">{{ \"Fee amount\" | rpxTranslate }}</td>\n <td [ngClass]=\"{'tr-border': !fee.apportion_amount && !fee.remissions && !isTurnOff}\">\u00A3{{ fee?.calculated_amount | number:'.2' }}</td>\n </tr>\n\n <tr *ngIf=\"fee.apportion_amount\">\n <td class=\"bold tb-col-w tr-border\" [ngClass]=\"{'tr-border': !fee.remissions}\">{{ \"Allocated amount\" | rpxTranslate }}</td>\n <td [ngClass]=\"{'tr-border': !fee.remissions}\">\u00A3{{ fee?.apportion_amount | number:'.2' }}</td>\n </tr>\n\n </tbody>\n </table>\n <button [disabled]=\"!chkIsAddRemissionBtnEnable(fee)\" (click)=\"addRemission(fee)\" class=\"govuk-button govuk-button--secondary\"> {{ \"Add remission\" | rpxTranslate }}</button>\n </div>\n\n <!-- remissions -->\n <div class=\"order-class\">\n <div class=\"column\">\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header col-24 whitespace-inherit\" scope=\"col\">{{ \"Help with fees or remission code\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-27 whitespace-inherit\" scope=\"col\">{{ \"Reference\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header whitespace-inherit\" scope=\"col\">{{ \"Fee\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header whitespace-inherit\" scope=\"col\">{{ \"Remission Amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header whitespace-inherit refundBtn\" scope=\"col\"></td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\" *ngFor=\"let remission of paymentGroup.remissions\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell whitespace-inherit\">{{ remission?.hwf_reference }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ remission?.remission_reference }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ remission?.fee_code }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ remission?.hwf_amount | currency:'GBP':'symbol-narrow':'1.2-2'}}</td>\n <td class=\"govuk-table__cell refundBtn whitespace-inherit\" >\n <button [disabled]=\"!canItBeRefunded(remission)\" (click)=\"addRefundForRemission(paymentGroup.payments[0],remission,paymentGroup.fees)\" class=\"govuk-button govuk-button--secondary\"> Add refund</button>\n </td>\n </tr>\n </tbody>\n\n\n </table>\n </div></div>\n\n <div *ngIf=\"paymentGroup.remissions?.length === 0\">\n <span class=\"mar-17\" >{{ \"No help with fees or remissions.\" | rpxTranslate }}</span>\n </div>\n\n </div>\n </div>\n </main>\n</div>\n\n</ng-container>\n<ng-container *ngIf=\"viewStatus === 'addremission' && feeId && viewCompStatus !== 'overpayment' && viewCompStatus !== 'overPaymentAddressCapture' && viewCompStatus !== 'overpaymentcheckandanswer'\">\n<ccpay-add-remission \n[isTurnOff]=\"isTurnOff\"\n[isStrategicFixEnable]=\"isStrategicFixEnable\"\n[viewCompStatus]= \"viewStatus\"\n[fee]=\"feeId\"\n[payment] = \"payment\"\n[orderStatus] =\"paymentGroup.payments[0].status\"\n[paidAmount]= \"paymentGroup.payments[0].amount\"\n[isRefundRemission]=\"isRefundRemission\"\n[caseType]=\"caseType\"\n[paymentGroupRef]=\"paymentGroup.payment_group_reference\"\n[isFromPaymentDetailPage] = \"true\"\n[ccdCaseNumber]=\"ccdCaseNumber\"\n[orderFeesTotal] = \"orderFeesTotal\"\n[orderTotalPayments] = \"orderTotalPayments\"\n[orderRemissionTotal] = \"orderRemissionTotal\"\n[orderRef] = \"orderRef\"\n[orderCreated] = \"orderCreated\"\n[orderParty] = \"orderParty\"\n[orderCCDEvent] = \"orderCCDEvent\"\n[orderDetail] = \"orderDetail\"\n[LOGGEDINUSERROLES] = \"LOGGEDINUSERROLES\"></ccpay-add-remission>\n</ng-container>\n\n<ng-container *ngIf=\"viewStatus === 'addrefundforremission' && payment && viewCompStatus !== 'overpayment' && viewCompStatus !== 'overPaymentAddressCapture' && viewCompStatus !== 'overpaymentcheckandanswer'\">\n\n<ccpay-add-remission\n[isTurnOff]=\"isTurnOff\"\n[isStrategicFixEnable]=\"isStrategicFixEnable\"\n[viewCompStatus]= \"viewStatus\"\n[payment]=\"payment\"\n[orderStatus] =\"orderStatus\"\n[paidAmount]= \"orderTotalPayments\"\n[isRefundRemission]=\"isRefundRemission\"\n[caseType]=\"caseType\"\n[feeamount]=\"remissionFeeAmt\"\n[remission] = \"remissions\"\n[isFromServiceRequestPage]=\"false\"\n[paymentGroupRef]=\"paymentGroup.payment_group_reference\"\n[ccdCaseNumber]=\"ccdCaseNumber\"\n[orderFeesTotal] = \"orderFeesTotal\"\n[orderTotalPayments] = \"orderTotalPayments\"\n[orderRemissionTotal] = \"orderRemissionTotal\"\n[orderRef] = \"orderRef\"\n[orderCreated] = \"orderCreated\"\n[orderParty] = \"orderParty\"\n[orderCCDEvent] = \"orderCCDEvent\"\n[orderDetail] = \"orderDetail\"\n[LOGGEDINUSERROLES] = \"LOGGEDINUSERROLES\"></ccpay-add-remission>\n</ng-container>\n\n<ng-container *ngIf=\"viewStatus === 'issuerefund' && viewCompStatus !== 'overpayment' && viewCompStatus !== 'overPaymentAddressCapture' && viewCompStatus !== 'overpaymentcheckandanswer'\">\n <ccpay-add-remission \n [isTurnOff]=\"isTurnOff\"\n [isStrategicFixEnable]=\"isStrategicFixEnable\"\n [payment] = 'paymentGroup.payments[0]'\n [viewCompStatus]= \"viewStatus\"\n [orderStatus] =\"paymentGroup.payments[0].status\"\n [paidAmount]= \"paymentGroup.payments[0].amount\"\n [isRefundRemission]=\"isRefundRemission\"\n [caseType]=\"caseType\"\n [isFromServiceRequestPage]=\"isFromServiceRequestPage\"\n [isFromPaymentDetailPage] = \"isFromPaymentDetailPage\"\n [paymentGroupRef]=\"paymentGroup.payment_group_reference\"\n [ccdCaseNumber]=\"ccdCaseNumber\"\n [orderFeesTotal] = \"orderFeesTotal\"\n [orderTotalPayments] = \"orderTotalPayments\"\n [orderRemissionTotal] = \"orderRemissionTotal\"\n [orderRef] = \"orderRef\"\n [orderCreated] = \"orderCreated\"\n [orderParty] = \"orderParty\"\n [orderCCDEvent] = \"orderCCDEvent\"\n [orderDetail] = \"orderDetail\"\n [fees] =\"paymentFees\"\n [isFullyRefund] = \"isFullyRefund\"\n [LOGGEDINUSERROLES] = \"LOGGEDINUSERROLES\">\n \n ></ccpay-add-remission>\n</ng-container>\n<ng-container *ngIf=\"viewStatus === 'order-full-view' && viewCompStatus !== 'overpayment' && viewCompStatus !== 'overPaymentAddressCapture' && viewCompStatus !== 'overpaymentcheckandanswer'\">\n <ccpay-service-request\n [viewStatus] = \"viewStatus\"\n [orderRef] = \"orderRef\"\n [orderStatus] = \"orderStatus\"\n [orderCreated] = \"orderCreated\"\n [orderParty] = \"orderParty\"\n [orderCCDEvent] = \"orderCCDEvent\"\n [orderDetail] = \"orderDetail\"\n [LOGGEDINUSERROLES] = \"LOGGEDINUSERROLES\"\n [takePayment] = \"isTakePayment\"\n [ccdCaseNumber] = \"ccdCaseNumber\"\n [orderFeesTotal] = \"orderFeesTotal\"\n [orderTotalPayments] = \"orderTotalPayments\"\n [orderRemissionTotal] = \"orderRemissionTotal\"\n [isServiceRequest] = \"isServiceRequest\"\n (goToServiceRquestComponent) = \"goToServiceRequestPage()\"\n>\n</ccpay-service-request>\n\n</ng-container>\n</div>\n<div class=\"over-payment\">\n<ng-container *ngIf=\"viewCompStatus === 'overpayment'\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='OVERPAYMENTPAGE'> \n <h1 class=\"heading-large\">{{ \"Issue refund\" | rpxTranslate }}</h1>\n <h1 class=\"heading-medium\">{{ \"Case reference\" | rpxTranslate}}: {{ccdCaseNumber | ccdHyphens }}</h1>\n <span id=\"how-contacted-conditional-hint govuk-font19px\" class=\"form-hint\">\n {{ \"Payment reference\" | rpxTranslate }}: {{paymentGroup?.payments[0]?.reference}}\n </span>\n<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--l\">\n <h1 class=\"heading-medium\">{{ \"Select payment to refund\" | rpxTranslate }}</h1>\n </legend>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"over-payment\" name=\"over-payment\" type=\"radio\" (click)=\"selectPymentOption('op')\" value=\"op\">\n <label class=\"govuk-label govuk-radios__label govuk-font19px\" for=\"where-do-you-live\">\n {{ \"Over payment\" | rpxTranslate }} \u00A3{{getOverPaymentValue() | number:'.2'}}\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"full-payment\" name=\"over-payment\" type=\"radio\" (click)=\"selectPymentOption('fp')\" value=\"fp\">\n <label class=\"govuk-label govuk-radios__label govuk-font19px\" for=\"where-do-you-live-2\">\n {{ \"Full payment\" | rpxTranslate }} \u00A3{{paymentGroup?.payments[0]?.amount | number:'.2'}}\n </label>\n </div>\n </div>\n <button class=\"govuk-button govuk-button--secondary over-payment-alignment govuk-font19px\"\n (click)=\"goToPaymentViewComponent()\"> {{ \"Previous\" | rpxTranslate }}</button>\n <button \n (click)=\"continuePayment(paymentGroup)\"\n [disabled]=\"isContinueBtnDisabled\"\n [ngClass]='isContinueBtnDisabled ? \"button button--disabled govuk-!-margin-right-1 govuk-font19px\" : \"button govuk-!-margin-right-1 govuk-font19px\"'\n class=\"govuk-button\"> {{ \"Continue\" | rpxTranslate }}</button>\n </fieldset>\n</div>\n</ng-container>\n\n<ng-container *ngIf=\"viewCompStatus === 'overPaymentAddressCapture'\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='OVERPAYMENTADDRESSCAPTUREPAGE'> \n <h1 class=\"govuk-heading-l\">{{ \"Issue refund\" | rpxTranslate }}</h1>\n <h2 class=\"govuk-heading-m govuk-font19px\">{{ \"Case reference\" | rpxTranslate }}: {{ccdCaseNumber | ccdHyphens }}</h2>\n <span id=\"how-contacted-conditional-hint\" class=\"govuk-hint govuk-font19px\">\n {{ \"Payment reference\" | rpxTranslate }}: {{paymentGroup?.payments[0]?.reference}}\n </span>\n<ccpay-contact-details \n[addressObj] = notification\n(assignContactDetails)=\"getContactDetails($event)\"\n(redirectToIssueRefund)=\"gotoPaymentSelectPage($event)\" ></ccpay-contact-details>\n<p>\n <a (click)=\"goToCaseTransationPage($event)\" class=\"govuk-link\" data-module=\"govuk-button\">\n {{ \"Cancel\" | rpxTranslate }}\n </a>\n</p>\n</ng-container>\n\n<ng-container *ngIf=\"viewCompStatus === 'overpaymentcheckandanswer'\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='ADDREFUNDFORREMISSION'> \n <div class=\"govuk-warning-text\">\n \n <h1 class=\"heading-large\"> {{ \"Check your answers\" | rpxTranslate }}</h1>\n </div>\n <table class=\"govuk-table\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Payment reference\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\"> {{paymentGroup.payments[0].reference}} </td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Payment amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{paymentGroup.payments[0].amount | currency:'GBP':'symbol-narrow':'1.2-2'}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Fee amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{paymentGroup?.fees[0]?.net_amount | currency:'GBP':'symbol-narrow':'1.2-2'}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Refund amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{getOverPaymentValue() | currency:'GBP':'symbol-narrow':'1.2-2'}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Refund reason\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{ \"Over payment\" | rpxTranslate }}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Send to\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{orderParty}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Send via\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">\n <div *ngIf=\"contactDetailsObj?.notification_type === 'EMAIL'\" class=\"contactDetails-width\">\n <strong>{{ \"Email\" | rpxTranslate }}</strong>\n <br/>\n {{contactDetailsObj?.email?.trim()}}\n </div>\n <div *ngIf=\"contactDetailsObj?.notification_type === 'LETTER'\" class=\"contactDetails-width\">\n <strong>{{ \"Post\" | rpxTranslate }}</strong>\n <br/>\n {{contactDetailsObj?.address_line?.trim()}}&nbsp;{{contactDetailsObj?.city?.trim()}}&nbsp;{{contactDetailsObj?.county?.trim()}}&nbsp;{{contactDetailsObj?.country?.trim()}}&nbsp;{{contactDetailsObj?.postal_code?.trim()}}\n </div>\n <a (click)=\"gotoAddressPage(contactDetailsObj)\" class=\"govuk-link right\" >{{ \"Change\" | rpxTranslate }}</a>\n </td>\n </tr>\n\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Notification\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{templateInstructionType}}\n <a *ngIf=\"!notificationPreview\" href=\"Javascript:void(0)\" class=\"govuk-link right\" (click)=\"showNotificationPreview()\">\n {{ \"Preview\" | rpxTranslate }}\n </a>\n <a *ngIf=\"notificationPreview\" href=\"Javascript:void(0)\" class=\"govuk-link right\" (click)=\"hideNotificationPreview()\">\n {{ \"Hide Preview\" | rpxTranslate }}\n </a>\n </td>\n </tr>\n </table>\n\n <app-notification-preview *ngIf=\"notificationPreview\" \n [payment]=\"paymentGroup.payments[0]\" \n [contactDetails]=\"contactDetailsObj\"\n [refundReason]=\"'RR037'\"\n [refundAmount]=\"getOverPaymentValue()\"></app-notification-preview>\n\n <button type=\"submit\" class=\"button govuk-button--secondary over-payment-alignment govuk-font19px\" (click)=\"gotoAddressPage(contactDetailsObj)\">{{ \"Previous\" | rpxTranslate }}</button>\n <button type=\"submit\"\n [ngClass]='isContinueBtnDisabled ? \"button button--disabled govuk-!-margin-right-1 govuk-font19px\" : \"button govuk-!-margin-right-1 govuk-font19px\"'\n (click)=\"processRefund()\">\n {{ \"Submit refund\" | rpxTranslate }}\n </button>\n <p>\n <a href=\"javascript:void(0)\" (click)=\"goToCaseTransationPage($event)\" class=\"govuk-link govuk-font19px\" data-module=\"govuk-button\">\n {{ \"Cancel\" | rpxTranslate }}\n </a>\n </p>\n\n</ng-container>\n<ng-container *ngIf=\"viewStatus === 'refundconfirmationpage' && viewCompStatus !== 'overpayment' && viewCompStatus !== 'overPaymentAddressCapture' && viewCompStatus !== 'overpaymentcheckandanswer'\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='RETROREMISSIONREFUNDCONFIRMATIONPAGE'> \n <div class=\"govuk-grid-row pagesize\">\n <div >\n <div class=\"govuk-panel govuk-panel--confirmation\">\n <h1 class=\"govuk-panel_view_title\">\n {{ \"Refund submitted\" | rpxTranslate }}\n </h1>\n \n <div class=\"govuk-panel__body\">\n <p class=\"govuk-body white\"><strong class=\"white\">{{ \"Refund reference\" | rpxTranslate}}: {{refundReference}}</strong></p>\n </div>\n \n </div>\n <h2 class=\"govuk-heading-l\">{{\"What happens next\" | rpxTranslate }}</h2>\n <p class=\"govuk-body\">\n {{\"A refund request for\" | rpxTranslate }} {{refundAmount | currency:'GBP':'symbol-narrow':'1.2-2' }} {{ \"has been created and will be passed to a team leader to approve.\" | rpxTranslate }}\n </p>\n <p class=\"govuk-body\">\n <a href=\"javascript:void(0)\" (click)=\"goToCaseTransationPage($event)\" class=\"govuk-link pointer\" data-module=\"govuk-button\">\n {{ \"Return to case\" | rpxTranslate }}\n </a>\n </p>\n </div>\n </div>\n\n</ng-container>\n</div>\n\n<ng-container *ngIf=\"viewStatus === 'payment-failure'\">\n <div class=\"payment-failure-alignment\">\n <div class=\"govuk-breadcrumbs\">\n <ol class=\"govuk-breadcrumbs__list\">\n <li class=\"govuk-breadcrumbs__list-item\">\n <a href=\"javascript:void(0)\" (click)=\"goBackToPaymentView($event)\" class=\"govuk-back-link\">{{ \"Back\" | rpxTranslate }}</a>\n </li>\n </ol>\n </div>\n <div class=\"govuk-grid-row\">\n <div class=\"column\">\n <h1 class=\"heading-large govuk-!-margin-top-0\">{{ \"Failure event details\" | rpxTranslate }}</h1>\n </div>\n </div>\n <table>\n <tbody>\n\n <tr class=\"section\">\n <td class=\"bold\">{{ \"Failure reference\" | rpxTranslate }}</td>\n <td>\t{{selectedPaymentsStatus.failure_reference}}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold\">{{ \"Failure reason\" | rpxTranslate }}</td>\n <td>\t{{selectedPaymentsStatus.failure_reason | rpxTranslate}}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold\">{{ \"Payment reference\" | rpxTranslate }}</td>\n <td>{{ selectedPaymentsStatus.payment_reference }}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold\">{{ \"Payment amount\" | rpxTranslate }}</td>\n <td> \u00A3{{ paymentGroup?.payments[0]?.amount | number:'.2' }}</td>\n\n </tr>\n <tr class=\"section\">\n <td class=\"bold\">{{ \"Disputed amount\" | rpxTranslate }}</td>\n <td>\t\u00A3{{selectedPaymentsStatus.disputed_amount | number:'.2'}}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold\">{{ \"Additional information\" | rpxTranslate }}</td>\n <td>\t{{selectedPaymentsStatus.additional_reference }}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold\">{{ \"Failure type\" | rpxTranslate }}</td>\n <td>\t{{ selectedPaymentsStatus.failure_type }}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold\">{{ \"Failure event date and time\" | rpxTranslate }}</td>\n <td> {{ selectedPaymentsStatus.failure_event_date_time | date:'dd MMM yyyy HH:mm:ss' }}</td>\n </tr>\n <tr class=\"section\" *ngIf=\"selectedPaymentsStatus.has_amount_debited\">\n <td class=\"bold\">{{ \"Has disputed amount debited\" | rpxTranslate }}</td>\n <td>\t{{selectedPaymentsStatus.has_amount_debited}}</td>\n </tr>\n <tr class=\"section\" *ngIf=\"selectedPaymentsStatus.representment_status\">\n <td class=\"bold\">{{ \"Status following representation of payment\" | rpxTranslate }}</td>\n <td>\t{{(selectedPaymentsStatus.representment_status === 'Yes' || selectedPaymentsStatus.representment_status === 'yes') ? 'Success' : 'Failure'}}</td>\n </tr>\n <tr class=\"section\" *ngIf=\"selectedPaymentsStatus.representment_date\">\n <td class=\"bold\">{{ \"Date payment represented\" | rpxTranslate }}</td>\n <td>\t{{selectedPaymentsStatus.representment_date | date:'dd MMM yyyy HH:mm:ss'}}</td>\n </tr>\n </tbody>\n </table>\n\n <div>\n </div>\n </div>\n</ng-container>\n", styles: [".payment-view-section .tb-col-w{width:330px}.payment-view-section .tr-border{border-bottom:2px solid}.payment-view-section .payment-view-alignment{margin-left:30px}.payment-view-section .govuk-button{font-size:19px;float:left;margin-top:2em}.payment-view-section .remission{margin-bottom:7em}.payment-view-section .govuk-error-summary__title{font-size:24px!important}.payment-view-section .govuk-table__cell,.payment-view-section .govuk-table__header{padding:0;line-height:1.3;vertical-align:middle}.payment-view-section .govuk-table__row{line-height:1.3}.payment-view-section .govuk-table__cell:last-child{text-align:right}.payment-view-section .text-transform:first-letter{text-transform:capitalize}.payment-view-section .govuk-link{cursor:pointer}.payment-view-section .mar-17{font-size:19px!important}.over-payment .pagesize{margin:2em;width:97%}.over-payment .contactDetails-width{width:70%}.over-payment .margin-top10px{margin-top:20px}.over-payment .govuk-font19px{font-size:19px!important}.over-payment .margin-top--size{margin-top:-30px}.over-payment .over-payment-alignment{margin-right:10px}.over-payment .govuk-button{font-size:19px;float:left;margin-top:2em}.over-payment td.govuk-table__cell{width:50%}.over-payment .govuk-warning-text__text,.over-payment .govuk-label--s,.over-payment .label_payment__symbol{font-size:19px;font-weight:400}.over-payment .inline-error-class{outline:3px solid #a71414;outline-offset:0;border-color:#a71414}.over-payment .inline-error-message{color:#a71414;border-color:#a71414;font-weight:700;margin-top:10px;font-size:20px}.over-payment .govuk-button-group{padding-top:2em}.over-payment .heading-medium{margin-top:.875em}.over-payment .heading-large{margin-top:.25em}.over-payment .govuk-panel--confirmation{color:#fff;background:#00703c}.over-payment .govuk-panel__title{font-size:5rem}.over-payment .govuk-body-m,.over-payment .govuk-body{font-size:2.1875rem}.over-payment .govuk-link{cursor:pointer}.over-payment .govuk-radios__conditional{padding-top:12px!important}.over-payment .right{float:right;cursor:pointer}.over-payment .radio{float:right}.over-payment .white{color:#fff}.whitespace-inherit{white-space:inherit!important}.govuk-panel_view_title{margin-top:0;margin-bottom:30px;color:#fff;font-family:nta,Arial,sans-serif;-webkit-font-smoothing:antialiased;font-weight:700}.white{color:#fff}.hmcts-currency-input__symbol{font-family:nta,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px;line-height:initial;position:absolute;font-weight:200;padding:8px 10px;height:40px;box-sizing:border-box;background-color:#dee0e2;border:2px solid #0b0c0c}\n"], dependencies: [{ kind: "ngmodule", type: i0.forwardRef(() => CommonModule) }, { kind: "directive", type: i0.forwardRef(() => i3.NgClass), selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i0.forwardRef(() => i3.NgForOf), selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i0.forwardRef(() => i3.NgIf), selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i0.forwardRef(() => AddRemissionComponent), selector: "ccpay-add-remission", inputs: ["fee", "fees", "payment", "remission", "ccdCaseNumber", "caseType", "viewCompStatus", "paymentGroupRef", "isTurnOff", "isRefundRemission", "isStrategicFixEnable", "paidAmount", "isFromRefundListPage", "isFromPaymentDetailPage", "isFromServiceRequestPage", "isFullyRefund", "feeamount", "refundPaymentReference", "isFromRefundStatusPage", "changeRefundReason", "isServiceRequest", "LOGGEDINUSERROLES", "orderDetail", "orderRef", "orderStatus", "orderParty", "orderCreated", "orderCCDEvent", "takepayment", "orderFeesTotal", "orderTotalPayments", "orderRemissionTotal"], outputs: ["cancelRemission", "refundListReason", "refundListAmount", "refundFees"] }, { kind: "component", type: i0.forwardRef(() => StatusHistoryComponent), selector: "ccpay-payment-statuses", inputs: ["isTakePayment"] }, { kind: "component", type: i0.forwardRef(() => ServiceRequestComponent), selector: "ccpay-service-request", inputs: ["LOGGEDINUSERROLES", "viewStatus", "orderDetail", "orderRef", "orderStatus", "orderParty", "orderCreated", "orderCCDEvent", "orderFeesTotal", "orderTotalPayments", "orderRemissionTotal", "paymentGroupList", "takePayment", "ccdCaseNumber", "isServiceRequest"], outputs: ["goToServiceRquestComponent"] }, { kind: "component", type: i0.forwardRef(() => ContactDetailsComponent), selector: "ccpay-contact-details", inputs: ["isEditOperation", "isEditOperationInRefundList", "addressObj"], outputs: ["assignContactDetails", "assignContactDetailsInFefundsList", "redirectToIssueRefund"] }, { kind: "component", type: i0.forwardRef(() => NotificationPreviewComponent), selector: "app-notification-preview", inputs: ["payment", "contactDetails", "refundReason", "refundAmount", "paymentReference", "refundReference", "previewJourney", "notificationSent"], outputs: ["notificationPreviewEvent"] }, { kind: "ngmodule", type: i0.forwardRef(() => RpxTranslationModule) }, { kind: "pipe", type: i0.forwardRef(() => i3.DecimalPipe), name: "number" }, { kind: "pipe", type: i0.forwardRef(() => i3.CurrencyPipe), name: "currency" }, { kind: "pipe", type: i0.forwardRef(() => i3.DatePipe), name: "date" }, { kind: "pipe", type: i0.forwardRef(() => CcdHyphensPipe), name: "ccdHyphens" }, { kind: "pipe", type: i0.forwardRef(() => CapitalizePipe), name: "capitalize" }, { kind: "pipe", type: i0.forwardRef(() => i8.RpxTranslatePipe), name: "rpxTranslate" }] });
5148
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: PaymentViewComponent, deps: [{ token: PaymentViewService }, { token: NotificationService }, { token: 'PAYMENT_LIB' }, { token: i0.ChangeDetectorRef }, { token: OrderslistService }], target: i0.ɵɵFactoryTarget.Component });
5149
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: PaymentViewComponent, isStandalone: true, selector: "ccpay-payment-view", inputs: { isTurnOff: "isTurnOff", isTakePayment: "isTakePayment", caseType: "caseType", orderRef: "orderRef", orderStatus: "orderStatus", orderTotalPayments: "orderTotalPayments", payment: "payment", LOGGEDINUSERROLES: "LOGGEDINUSERROLES", ISPAYMENTSTATUSENABLED: "ISPAYMENTSTATUSENABLED", orderParty: "orderParty", orderCreated: "orderCreated", orderCCDEvent: "orderCCDEvent", orderFeesTotal: "orderFeesTotal", orderRemissionTotal: "orderRemissionTotal", orderDetail: "orderDetail", isServiceRequest: "isServiceRequest" }, providers: [{ provide: 'PAYMENT_VIEW', useExisting: forwardRef(() => PaymentViewComponent) }], ngImport: i0, template: "<div class=\"payment-view-section\">\n<ng-container *ngIf=\"viewStatus === 'paymentview' && viewCompStatus !== 'overpayment' && viewCompStatus !== 'overPaymentAddressCapture' && viewCompStatus !== 'overpaymentcheckandanswer'\">\n<div class=\"govuk-width-container\">\n\n <div class=\"govuk-breadcrumbs\">\n <ol class=\"govuk-breadcrumbs__list\">\n <li class=\"govuk-breadcrumbs__list-item\">\n <a href=\"javascript:void(0)\" (click)=\"goToCaseTransationPage($event)\" class=\"govuk-back-link\">{{ \"Back\" | rpxTranslate }}</a>\n </li>\n </ol>\n </div>\n\n <main class=\"govuk-main-wrapper govuk-!-padding-top-0\" id=\"main-content\" role=\"main\">\n\n <div *ngIf=\"errorMessage\">\n <div class=\"error-summary\" role=\"group\" aria-labelledby=\"failure-error-summary-heading\" tabindex=\"-1\">\n <h2 class=\"heading-medium error-summary-heading\" id=\"failure-error-summary-heading\">\n {{ \"Payment details could not be retrieved\" | rpxTranslate }}\n </h2>\n <div class=\"govuk-error-summary__body\">\n {{ errorMessage | rpxTranslate }}\n </div>\n </div>\n </div>\n\n <div class=\"payment-view-alignment\" *ngIf=\"!errorMessage && paymentGroup?.payments[0]\">\n\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='PAYMENTDETAILS'>\n <div class=\"govuk-grid-row\">\n <div class=\"column\">\n <h1 class=\"heading-large govuk-!-margin-top-0\">{{ \"Payment details\" | rpxTranslate }}</h1>\n </div>\n </div>\n <table>\n <tbody>\n\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">{{ \"Service request reference\" | rpxTranslate }}</td>\n <td class=\"tb-col-w\">{{ serviceReference }}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">{{ \"Payment reference\" | rpxTranslate }}</td>\n <td class=\"tb-col-w\">{{ paymentGroup?.payments[0]?.reference }}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">{{ \"Payment amount\" | rpxTranslate }}</td>\n <td class=\"tb-col-w\">\u00A3{{ paymentGroup?.payments[0]?.amount | number:'.2' }}</td>\n </tr>\n <tr class=\"section\" *ngIf=\"paymentGroup?.payments[0]?.over_payment > 0\">\n <td class=\"bold tb-col-w\">{{ \"Over payment\" | rpxTranslate }}</td>\n <td class=\"tb-col-w\">\u00A3{{ getOverPaymentValue() | number:'.2' }}</td>\n </tr>\n <tr class=\"section\" *ngIf=\"paymentGroup?.payments[0] && paymentGroup?.payments[0]?.document_control_number && !paymentGroup?.payments[0]?.external_reference\">\n <td class=\"bold tb-col-w\">{{ \"Payment asset number\" | rpxTranslate}}(DCN)</td>\n <td class=\"tb-col-w\">{{ paymentGroup?.payments[0]?.document_control_number }}</td>\n </tr>\n <tr class=\"section\" *ngIf=\"paymentGroup?.payments[0] && paymentGroup?.payments[0]?.document_control_number && !paymentGroup?.payments[0]?.external_reference\">\n <td class=\"bold tb-col-w\">{{ \"Banked date\" | rpxTranslate }}</td>\n <td class=\"tb-col-w\">{{ paymentGroup?.payments[0]?.banked_date | date:'dd MMM yyyy' }}</td>\n </tr>\n <tr class=\"section\" *ngIf=\"paymentGroup?.payments[0] && paymentGroup?.payments[0]?.external_reference\">\n <td class=\"bold tb-col-w\">{{ \"GovPay Transaction ID\" | rpxTranslate: {gov: \"GovPay\", id: \"ID\"} }}</td>\n <td class=\"tb-col-w\">{{ paymentGroup?.payments[0]?.external_reference }}</td>\n </tr>\n <tr class=\"section\" >\n <td class=\"bold tb-col-w\">{{ \"Payment method\" | rpxTranslate }}</td>\n <td class=\"tb-col-w text-transform\">{{ paymentGroup?.payments[0]?.method | rpxTranslate }}</td>\n </tr>\n <tr class=\"section\" *ngIf=\"paymentGroup?.payments[0]?.method === 'payment by account'\" >\n <td class=\"bold tb-col-w\">{{ \"Type\" | rpxTranslate }}</td>\n <td class=\"tb-col-w\" *ngIf=\"paymentGroup?.payments[0]?.method !== 'card'\">{{ \"Credit\" | rpxTranslate }}</td>\n <td class=\"tb-col-w\" *ngIf=\"paymentGroup?.payments[0]?.method === 'card'\">{{ \"Card\" | rpxTranslate }}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">{{ \"Channel\" | rpxTranslate }}</td>\n <td class=\"tb-col-w text-transform\">{{ paymentGroup?.payments[0]?.channel | rpxTranslate }}</td>\n </tr>\n <!-- <tr class=\"section\">\n <td class=\"bold tb-col-w\">Method</td>\n <td *ngIf=\"paymentGroup?.payments[0]?.method !== 'card'\">{{ paymentGroup?.payments[0]?.method }}</td>\n <td *ngIf=\"paymentGroup?.payments[0]?.method === 'card'\">CARD</td>\n </tr> -->\n <!-- <tr class=\"section\" *ngIf=\"paymentGroup?.payments[0]?.channel !== 'telephony'\">\n <td class=\"bold tb-col-w\">Status</td>\n <td>{{ paymentGroup?.payments[0]?.status }}</td>\n </tr> -->\n <tr class=\"section\" *ngIf=\"paymentGroup?.payments[0]?.payment_allocation[0] !== undefined\">\n <td class=\"bold tb-col-w\">{{ \"Allocaton status\" | rpxTranslate }}</td>\n <td class=\"tb-col-w\">{{ paymentGroup?.payments[0]?.payment_allocation[0]?.allocation_status | rpxTranslate }}</td>\n </tr>\n\n <tr *ngIf=\"paymentGroup?.payments[0].organisation_name\">\n <td class=\"bold tb-col-w\">{{ \"PBA account name\" | rpxTranslate: {pba: \"PBA\"} }}</td>\n <td class=\"tb-col-w\">{{ paymentGroup?.payments[0]?.organisation_name }}</td>\n </tr>\n\n <tr *ngIf=\"paymentGroup?.payments[0].account_number\">\n <td class=\"bold tb-col-w\">PBA {{ \"number\" | rpxTranslate }}</td>\n <td class=\"tb-col-w\">{{ paymentGroup?.payments[0]?.account_number }}</td>\n </tr>\n\n <tr *ngIf=\"paymentGroup?.payments[0].customer_reference\">\n <td class=\"bold tb-col-w\">{{ \"Customer internal reference\" | rpxTranslate }}</td>\n <td class=\"tb-col-w\">{{ paymentGroup?.payments[0]?.customer_reference }}</td>\n </tr>\n\n </tbody>\n </table>\n\n <div>\n <!-- Status histories -->\n <ccpay-payment-statuses *ngIf=\"isStatusAllocated\" [isTakePayment]=\"isTakePayment\"></ccpay-payment-statuses>\n </div>\n <div class=\"remission\">\n <button [disabled]=\"!chkIsIssueRefundBtnEnable(paymentGroup?.payments[0])\" (click)=\"issueRefund(paymentGroup)\" class=\"govuk-button govuk-button--secondary\">{{ \"Issue refund\" | rpxTranslate }}</button>\n </div>\n<div *ngIf=\"ISPAYMENTSTATUSENABLED\">\n <div class=\"column\">\n <h2 class=\"heading-medium\">{{ \"Disputed payment history\" | rpxTranslate }}</h2>\n </div>\n \n <div>\n <table>\n <thead>\n <tr>\n <th>{{ \"Status\" | rpxTranslate }}</th>\n <th>{{ \"Amount\" | rpxTranslate }}</th>\n <th>{{ \"Date\" | rpxTranslate }}</th>\n <th>{{ \"Payment reference\" | rpxTranslate }}</th>\n <th>{{ \"Event\" | rpxTranslate }}</th>\n <th></th>\n </tr>\n </thead> \n <tbody *ngIf=\"!errorMsg && allPaymentsFailure.length > 0\">\n <tr *ngFor=\"let payment of allPaymentsFailure\">\n <td>{{ payment.status | capitalize | rpxTranslate }}</td>\n <td>\u00A3{{ payment.disputed_amount | number:'.2' }}</td>\n <td>{{(payment.representment_date ? payment.representment_date : payment.failure_event_date_time) | date:'dd MMM yyyy'}}</td>\n <td>{{ payment.payment_reference }}</td>\n <td >{{ payment.failure_type | rpxTranslate }}</td>\n <td>\n \n <a href=\"javascript:void(0)\" (click)=\"goToPaymentFailuePage(payment)\">{{ \"Show detail\" | rpxTranslate }}</a>\n\n </td>\n </tr>\n </tbody>\n <tbody *ngIf=\"errorMsg || allPaymentsFailure.length === 0\">\n <tr>\n <td colspan=\"6\"> {{ \"No disputed payment history available.\" | rpxTranslate }} </td>\n </tr>\n </tbody>\n </table>\n </div>\n <br/>\n <br/>\n </div>\n \n <div *ngIf=\"checkForFees(paymentGroup)\">\n <div *ngIf=\"paymentGroup.fees.length > 0\">\n <div class=\"column\">\n <br/>\n <br/>\n <h2 class=\"heading-large\">{{ \"Fee and remission details\" | rpxTranslate }}</h2>\n\n </div>\n </div>\n\n <div *ngFor=\"let fee of paymentGroup.fees\">\n <table class=\"table\">\n <tbody>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">{{ \"Description\" | rpxTranslate }}</td>\n <td class=\"tb-col-w\">{{ \"Application for\" | rpxTranslate }} {{ fee.description | rpxTranslate }}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">{{ \"Fee code\" | rpxTranslate }}</td>\n <td class=\"tb-col-w\">{{ fee?.code }}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\" [ngClass]=\"{'tr-border': !fee.apportion_amount && !fee.remissions && !isTurnOff }\">{{ \"Fee amount\" | rpxTranslate }}</td>\n <td [ngClass]=\"{'tr-border': !fee.apportion_amount && !fee.remissions && !isTurnOff}\">\u00A3{{ fee?.calculated_amount | number:'.2' }}</td>\n </tr>\n\n <tr *ngIf=\"fee.apportion_amount\">\n <td class=\"bold tb-col-w tr-border\" [ngClass]=\"{'tr-border': !fee.remissions}\">{{ \"Allocated amount\" | rpxTranslate }}</td>\n <td [ngClass]=\"{'tr-border': !fee.remissions}\">\u00A3{{ fee?.apportion_amount | number:'.2' }}</td>\n </tr>\n\n </tbody>\n </table>\n <button [disabled]=\"!chkIsAddRemissionBtnEnable(fee)\" (click)=\"addRemission(fee)\" class=\"govuk-button govuk-button--secondary\"> {{ \"Add remission\" | rpxTranslate }}</button>\n </div>\n\n <!-- remissions -->\n <div class=\"order-class\">\n <div class=\"column\">\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header col-24 whitespace-inherit\" scope=\"col\">{{ \"Help with fees or remission code\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header col-27 whitespace-inherit\" scope=\"col\">{{ \"Reference\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header whitespace-inherit\" scope=\"col\">{{ \"Fee\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header whitespace-inherit\" scope=\"col\">{{ \"Remission Amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__header whitespace-inherit refundBtn\" scope=\"col\"></td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\" *ngFor=\"let remission of paymentGroup.remissions\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell whitespace-inherit\">{{ remission?.hwf_reference }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ remission?.remission_reference }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ remission?.fee_code }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">{{ remission?.hwf_amount | currency:'GBP':'symbol-narrow':'1.2-2'}}</td>\n <td class=\"govuk-table__cell refundBtn whitespace-inherit\" >\n <button [disabled]=\"!canItBeRefunded(remission)\" (click)=\"addRefundForRemission(paymentGroup.payments[0],remission,paymentGroup.fees)\" class=\"govuk-button govuk-button--secondary\"> Add refund</button>\n </td>\n </tr>\n </tbody>\n\n\n </table>\n </div></div>\n\n <div *ngIf=\"paymentGroup.remissions?.length === 0\">\n <span class=\"mar-17\" >{{ \"No help with fees or remissions.\" | rpxTranslate }}</span>\n </div>\n\n </div>\n </div>\n </main>\n</div>\n\n</ng-container>\n<ng-container *ngIf=\"viewStatus === 'addremission' && feeId && viewCompStatus !== 'overpayment' && viewCompStatus !== 'overPaymentAddressCapture' && viewCompStatus !== 'overpaymentcheckandanswer'\">\n<ccpay-add-remission \n[isTurnOff]=\"isTurnOff\"\n[isStrategicFixEnable]=\"isStrategicFixEnable\"\n[viewCompStatus]= \"viewStatus\"\n[fee]=\"feeId\"\n[payment] = \"payment\"\n[orderStatus] =\"paymentGroup.payments[0].status\"\n[paidAmount]= \"paymentGroup.payments[0].amount\"\n[isRefundRemission]=\"isRefundRemission\"\n[caseType]=\"caseType\"\n[paymentGroupRef]=\"paymentGroup.payment_group_reference\"\n[isFromPaymentDetailPage] = \"true\"\n[ccdCaseNumber]=\"ccdCaseNumber\"\n[orderFeesTotal] = \"orderFeesTotal\"\n[orderTotalPayments] = \"orderTotalPayments\"\n[orderRemissionTotal] = \"orderRemissionTotal\"\n[orderRef] = \"orderRef\"\n[orderCreated] = \"orderCreated\"\n[orderParty] = \"orderParty\"\n[orderCCDEvent] = \"orderCCDEvent\"\n[orderDetail] = \"orderDetail\"\n[LOGGEDINUSERROLES] = \"LOGGEDINUSERROLES\"></ccpay-add-remission>\n</ng-container>\n\n<ng-container *ngIf=\"viewStatus === 'addrefundforremission' && payment && viewCompStatus !== 'overpayment' && viewCompStatus !== 'overPaymentAddressCapture' && viewCompStatus !== 'overpaymentcheckandanswer'\">\n\n<ccpay-add-remission\n[isTurnOff]=\"isTurnOff\"\n[isStrategicFixEnable]=\"isStrategicFixEnable\"\n[viewCompStatus]= \"viewStatus\"\n[payment]=\"payment\"\n[orderStatus] =\"orderStatus\"\n[paidAmount]= \"orderTotalPayments\"\n[isRefundRemission]=\"isRefundRemission\"\n[caseType]=\"caseType\"\n[feeamount]=\"remissionFeeAmt\"\n[remission] = \"remissions\"\n[isFromServiceRequestPage]=\"false\"\n[paymentGroupRef]=\"paymentGroup.payment_group_reference\"\n[ccdCaseNumber]=\"ccdCaseNumber\"\n[orderFeesTotal] = \"orderFeesTotal\"\n[orderTotalPayments] = \"orderTotalPayments\"\n[orderRemissionTotal] = \"orderRemissionTotal\"\n[orderRef] = \"orderRef\"\n[orderCreated] = \"orderCreated\"\n[orderParty] = \"orderParty\"\n[orderCCDEvent] = \"orderCCDEvent\"\n[orderDetail] = \"orderDetail\"\n[LOGGEDINUSERROLES] = \"LOGGEDINUSERROLES\"></ccpay-add-remission>\n</ng-container>\n\n<ng-container *ngIf=\"viewStatus === 'issuerefund' && viewCompStatus !== 'overpayment' && viewCompStatus !== 'overPaymentAddressCapture' && viewCompStatus !== 'overpaymentcheckandanswer'\">\n <ccpay-add-remission \n [isTurnOff]=\"isTurnOff\"\n [isStrategicFixEnable]=\"isStrategicFixEnable\"\n [payment] = 'paymentGroup.payments[0]'\n [viewCompStatus]= \"viewStatus\"\n [orderStatus] =\"paymentGroup.payments[0].status\"\n [paidAmount]= \"paymentGroup.payments[0].amount\"\n [isRefundRemission]=\"isRefundRemission\"\n [caseType]=\"caseType\"\n [isFromServiceRequestPage]=\"isFromServiceRequestPage\"\n [isFromPaymentDetailPage] = \"isFromPaymentDetailPage\"\n [paymentGroupRef]=\"paymentGroup.payment_group_reference\"\n [ccdCaseNumber]=\"ccdCaseNumber\"\n [orderFeesTotal] = \"orderFeesTotal\"\n [orderTotalPayments] = \"orderTotalPayments\"\n [orderRemissionTotal] = \"orderRemissionTotal\"\n [orderRef] = \"orderRef\"\n [orderCreated] = \"orderCreated\"\n [orderParty] = \"orderParty\"\n [orderCCDEvent] = \"orderCCDEvent\"\n [orderDetail] = \"orderDetail\"\n [fees] =\"paymentFees\"\n [isFullyRefund] = \"isFullyRefund\"\n [LOGGEDINUSERROLES] = \"LOGGEDINUSERROLES\">\n \n ></ccpay-add-remission>\n</ng-container>\n<ng-container *ngIf=\"viewStatus === 'order-full-view' && viewCompStatus !== 'overpayment' && viewCompStatus !== 'overPaymentAddressCapture' && viewCompStatus !== 'overpaymentcheckandanswer'\">\n <ccpay-service-request\n [viewStatus] = \"viewStatus\"\n [orderRef] = \"orderRef\"\n [orderStatus] = \"orderStatus\"\n [orderCreated] = \"orderCreated\"\n [orderParty] = \"orderParty\"\n [orderCCDEvent] = \"orderCCDEvent\"\n [orderDetail] = \"orderDetail\"\n [LOGGEDINUSERROLES] = \"LOGGEDINUSERROLES\"\n [takePayment] = \"isTakePayment\"\n [ccdCaseNumber] = \"ccdCaseNumber\"\n [orderFeesTotal] = \"orderFeesTotal\"\n [orderTotalPayments] = \"orderTotalPayments\"\n [orderRemissionTotal] = \"orderRemissionTotal\"\n [isServiceRequest] = \"isServiceRequest\"\n (goToServiceRquestComponent) = \"goToServiceRequestPage()\"\n>\n</ccpay-service-request>\n\n</ng-container>\n</div>\n<div class=\"over-payment\">\n<ng-container *ngIf=\"viewCompStatus === 'overpayment'\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='OVERPAYMENTPAGE'> \n <h1 class=\"heading-large\">{{ \"Issue refund\" | rpxTranslate }}</h1>\n <h1 class=\"heading-medium\">{{ \"Case reference\" | rpxTranslate}}: {{ccdCaseNumber | ccdHyphens }}</h1>\n <span id=\"how-contacted-conditional-hint govuk-font19px\" class=\"form-hint\">\n {{ \"Payment reference\" | rpxTranslate }}: {{paymentGroup?.payments[0]?.reference}}\n </span>\n<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--l\">\n <h1 class=\"heading-medium\">{{ \"Select payment to refund\" | rpxTranslate }}</h1>\n </legend>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"over-payment\" name=\"over-payment\" type=\"radio\" (click)=\"selectPymentOption('op')\" value=\"op\">\n <label class=\"govuk-label govuk-radios__label govuk-font19px\" for=\"where-do-you-live\">\n {{ \"Over payment\" | rpxTranslate }} \u00A3{{getOverPaymentValue() | number:'.2'}}\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"full-payment\" name=\"over-payment\" type=\"radio\" (click)=\"selectPymentOption('fp')\" value=\"fp\">\n <label class=\"govuk-label govuk-radios__label govuk-font19px\" for=\"where-do-you-live-2\">\n {{ \"Full payment\" | rpxTranslate }} \u00A3{{paymentGroup?.payments[0]?.amount | number:'.2'}}\n </label>\n </div>\n </div>\n <button class=\"govuk-button govuk-button--secondary over-payment-alignment govuk-font19px\"\n (click)=\"goToPaymentViewComponent()\"> {{ \"Previous\" | rpxTranslate }}</button>\n <button \n (click)=\"continuePayment(paymentGroup)\"\n [disabled]=\"isContinueBtnDisabled\"\n [ngClass]='isContinueBtnDisabled ? \"button button--disabled govuk-!-margin-right-1 govuk-font19px\" : \"button govuk-!-margin-right-1 govuk-font19px\"'\n class=\"govuk-button\"> {{ \"Continue\" | rpxTranslate }}</button>\n </fieldset>\n</div>\n</ng-container>\n\n<ng-container *ngIf=\"viewCompStatus === 'overPaymentAddressCapture'\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='OVERPAYMENTADDRESSCAPTUREPAGE'> \n <h1 class=\"govuk-heading-l\">{{ \"Issue refund\" | rpxTranslate }}</h1>\n <h2 class=\"govuk-heading-m govuk-font19px\">{{ \"Case reference\" | rpxTranslate }}: {{ccdCaseNumber | ccdHyphens }}</h2>\n <span id=\"how-contacted-conditional-hint\" class=\"govuk-hint govuk-font19px\">\n {{ \"Payment reference\" | rpxTranslate }}: {{paymentGroup?.payments[0]?.reference}}\n </span>\n<ccpay-contact-details \n[addressObj] = notification\n(assignContactDetails)=\"getContactDetails($event)\"\n(redirectToIssueRefund)=\"gotoPaymentSelectPage($event)\" ></ccpay-contact-details>\n<p>\n <a (click)=\"goToCaseTransationPage($event)\" class=\"govuk-link\" data-module=\"govuk-button\">\n {{ \"Cancel\" | rpxTranslate }}\n </a>\n</p>\n</ng-container>\n\n<ng-container *ngIf=\"viewCompStatus === 'overpaymentcheckandanswer'\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='ADDREFUNDFORREMISSION'> \n <div class=\"govuk-warning-text\">\n \n <h1 class=\"heading-large\"> {{ \"Check your answers\" | rpxTranslate }}</h1>\n </div>\n <table class=\"govuk-table\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Payment reference\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\"> {{paymentGroup.payments[0].reference}} </td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Payment amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{paymentGroup.payments[0].amount | currency:'GBP':'symbol-narrow':'1.2-2'}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Fee amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{paymentGroup?.fees[0]?.net_amount | currency:'GBP':'symbol-narrow':'1.2-2'}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Refund amount\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{getOverPaymentValue() | currency:'GBP':'symbol-narrow':'1.2-2'}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Refund reason\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{ \"Over payment\" | rpxTranslate }}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Send to\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{orderParty}}</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Send via\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell whitespace-inherit\">\n <div *ngIf=\"contactDetailsObj?.notification_type === 'EMAIL'\" class=\"contactDetails-width\">\n <strong>{{ \"Email\" | rpxTranslate }}</strong>\n <br/>\n {{contactDetailsObj?.email?.trim()}}\n </div>\n <div *ngIf=\"contactDetailsObj?.notification_type === 'LETTER'\" class=\"contactDetails-width\">\n <strong>{{ \"Post\" | rpxTranslate }}</strong>\n <br/>\n {{contactDetailsObj?.address_line?.trim()}}&nbsp;{{contactDetailsObj?.city?.trim()}}&nbsp;{{contactDetailsObj?.county?.trim()}}&nbsp;{{contactDetailsObj?.country?.trim()}}&nbsp;{{contactDetailsObj?.postal_code?.trim()}}\n </div>\n <a (click)=\"gotoAddressPage(contactDetailsObj)\" class=\"govuk-link right\" >{{ \"Change\" | rpxTranslate }}</a>\n </td>\n </tr>\n\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell govuk-!-font-weight-bold\">{{ \"Notification\" | rpxTranslate }}</td>\n <td class=\"govuk-table__cell\">{{templateInstructionType}}\n <a *ngIf=\"!notificationPreview\" href=\"Javascript:void(0)\" class=\"govuk-link right\" (click)=\"showNotificationPreview()\">\n {{ \"Preview\" | rpxTranslate }}\n </a>\n <a *ngIf=\"notificationPreview\" href=\"Javascript:void(0)\" class=\"govuk-link right\" (click)=\"hideNotificationPreview()\">\n {{ \"Hide Preview\" | rpxTranslate }}\n </a>\n </td>\n </tr>\n </table>\n\n <app-notification-preview *ngIf=\"notificationPreview\" \n [payment]=\"paymentGroup.payments[0]\" \n [contactDetails]=\"contactDetailsObj\"\n [refundReason]=\"'RR037'\"\n [refundAmount]=\"getOverPaymentValue()\"></app-notification-preview>\n\n <button type=\"submit\" class=\"button govuk-button--secondary over-payment-alignment govuk-font19px\" (click)=\"gotoAddressPage(contactDetailsObj)\">{{ \"Previous\" | rpxTranslate }}</button>\n <button type=\"submit\"\n [ngClass]='isContinueBtnDisabled ? \"button button--disabled govuk-!-margin-right-1 govuk-font19px\" : \"button govuk-!-margin-right-1 govuk-font19px\"'\n (click)=\"processRefund()\">\n {{ \"Submit refund\" | rpxTranslate }}\n </button>\n <p>\n <a href=\"javascript:void(0)\" (click)=\"goToCaseTransationPage($event)\" class=\"govuk-link govuk-font19px\" data-module=\"govuk-button\">\n {{ \"Cancel\" | rpxTranslate }}\n </a>\n </p>\n\n</ng-container>\n<ng-container *ngIf=\"viewStatus === 'refundconfirmationpage' && viewCompStatus !== 'overpayment' && viewCompStatus !== 'overPaymentAddressCapture' && viewCompStatus !== 'overpaymentcheckandanswer'\">\n <input #myInput type='hidden' id='iFrameDrivenImageValue' value='RETROREMISSIONREFUNDCONFIRMATIONPAGE'> \n <div class=\"govuk-grid-row pagesize\">\n <div >\n <div class=\"govuk-panel govuk-panel--confirmation\">\n <h1 class=\"govuk-panel_view_title\">\n {{ \"Refund submitted\" | rpxTranslate }}\n </h1>\n \n <div class=\"govuk-panel__body\">\n <p class=\"govuk-body white\"><strong class=\"white\">{{ \"Refund reference\" | rpxTranslate}}: {{refundReference}}</strong></p>\n </div>\n \n </div>\n <h2 class=\"govuk-heading-l\">{{\"What happens next\" | rpxTranslate }}</h2>\n <p class=\"govuk-body\">\n {{\"A refund request for\" | rpxTranslate }} {{refundAmount | currency:'GBP':'symbol-narrow':'1.2-2' }} {{ \"has been created and will be passed to a team leader to approve.\" | rpxTranslate }}\n </p>\n <p class=\"govuk-body\">\n <a href=\"javascript:void(0)\" (click)=\"goToCaseTransationPage($event)\" class=\"govuk-link pointer\" data-module=\"govuk-button\">\n {{ \"Return to case\" | rpxTranslate }}\n </a>\n </p>\n </div>\n </div>\n\n</ng-container>\n</div>\n\n<ng-container *ngIf=\"viewStatus === 'payment-failure'\">\n <div class=\"payment-failure-alignment\">\n <div class=\"govuk-breadcrumbs\">\n <ol class=\"govuk-breadcrumbs__list\">\n <li class=\"govuk-breadcrumbs__list-item\">\n <a href=\"javascript:void(0)\" (click)=\"goBackToPaymentView($event)\" class=\"govuk-back-link\">{{ \"Back\" | rpxTranslate }}</a>\n </li>\n </ol>\n </div>\n <div class=\"govuk-grid-row\">\n <div class=\"column\">\n <h1 class=\"heading-large govuk-!-margin-top-0\">{{ \"Failure event details\" | rpxTranslate }}</h1>\n </div>\n </div>\n <table>\n <tbody>\n\n <tr class=\"section\">\n <td class=\"bold\">{{ \"Failure reference\" | rpxTranslate }}</td>\n <td>\t{{selectedPaymentsStatus.failure_reference}}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold\">{{ \"Failure reason\" | rpxTranslate }}</td>\n <td>\t{{selectedPaymentsStatus.failure_reason | rpxTranslate}}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold\">{{ \"Payment reference\" | rpxTranslate }}</td>\n <td>{{ selectedPaymentsStatus.payment_reference }}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold\">{{ \"Payment amount\" | rpxTranslate }}</td>\n <td> \u00A3{{ paymentGroup?.payments[0]?.amount | number:'.2' }}</td>\n\n </tr>\n <tr class=\"section\">\n <td class=\"bold\">{{ \"Disputed amount\" | rpxTranslate }}</td>\n <td>\t\u00A3{{selectedPaymentsStatus.disputed_amount | number:'.2'}}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold\">{{ \"Additional information\" | rpxTranslate }}</td>\n <td>\t{{selectedPaymentsStatus.additional_reference }}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold\">{{ \"Failure type\" | rpxTranslate }}</td>\n <td>\t{{ selectedPaymentsStatus.failure_type }}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold\">{{ \"Failure event date and time\" | rpxTranslate }}</td>\n <td> {{ selectedPaymentsStatus.failure_event_date_time | date:'dd MMM yyyy HH:mm:ss' }}</td>\n </tr>\n <tr class=\"section\" *ngIf=\"selectedPaymentsStatus.has_amount_debited\">\n <td class=\"bold\">{{ \"Has disputed amount debited\" | rpxTranslate }}</td>\n <td>\t{{selectedPaymentsStatus.has_amount_debited}}</td>\n </tr>\n <tr class=\"section\" *ngIf=\"selectedPaymentsStatus.representment_status\">\n <td class=\"bold\">{{ \"Status following representation of payment\" | rpxTranslate }}</td>\n <td>\t{{(selectedPaymentsStatus.representment_status === 'Yes' || selectedPaymentsStatus.representment_status === 'yes') ? 'Success' : 'Failure'}}</td>\n </tr>\n <tr class=\"section\" *ngIf=\"selectedPaymentsStatus.representment_date\">\n <td class=\"bold\">{{ \"Date payment represented\" | rpxTranslate }}</td>\n <td>\t{{selectedPaymentsStatus.representment_date | date:'dd MMM yyyy HH:mm:ss'}}</td>\n </tr>\n </tbody>\n </table>\n\n <div>\n </div>\n </div>\n</ng-container>\n", styles: [".payment-view-section .tb-col-w{width:330px}.payment-view-section .tr-border{border-bottom:2px solid}.payment-view-section .payment-view-alignment{margin-left:30px}.payment-view-section .govuk-button{font-size:19px;float:left;margin-top:2em}.payment-view-section .remission{margin-bottom:7em}.payment-view-section .govuk-error-summary__title{font-size:24px!important}.payment-view-section .govuk-table__cell,.payment-view-section .govuk-table__header{padding:0;line-height:1.3;vertical-align:middle}.payment-view-section .govuk-table__row{line-height:1.3}.payment-view-section .govuk-table__cell:last-child{text-align:right}.payment-view-section .text-transform:first-letter{text-transform:capitalize}.payment-view-section .govuk-link{cursor:pointer}.payment-view-section .mar-17{font-size:19px!important}.over-payment .pagesize{margin:2em;width:97%}.over-payment .contactDetails-width{width:70%}.over-payment .margin-top10px{margin-top:20px}.over-payment .govuk-font19px{font-size:19px!important}.over-payment .margin-top--size{margin-top:-30px}.over-payment .over-payment-alignment{margin-right:10px}.over-payment .govuk-button{font-size:19px;float:left;margin-top:2em}.over-payment td.govuk-table__cell{width:50%}.over-payment .govuk-warning-text__text,.over-payment .govuk-label--s,.over-payment .label_payment__symbol{font-size:19px;font-weight:400}.over-payment .inline-error-class{outline:3px solid #a71414;outline-offset:0;border-color:#a71414}.over-payment .inline-error-message{color:#a71414;border-color:#a71414;font-weight:700;margin-top:10px;font-size:20px}.over-payment .govuk-button-group{padding-top:2em}.over-payment .heading-medium{margin-top:.875em}.over-payment .heading-large{margin-top:.25em}.over-payment .govuk-panel--confirmation{color:#fff;background:#00703c}.over-payment .govuk-panel__title{font-size:5rem}.over-payment .govuk-body-m,.over-payment .govuk-body{font-size:2.1875rem}.over-payment .govuk-link{cursor:pointer}.over-payment .govuk-radios__conditional{padding-top:12px!important}.over-payment .right{float:right;cursor:pointer}.over-payment .radio{float:right}.over-payment .white{color:#fff}.whitespace-inherit{white-space:inherit!important}.govuk-panel_view_title{margin-top:0;margin-bottom:30px;color:#fff;font-family:nta,Arial,sans-serif;-webkit-font-smoothing:antialiased;font-weight:700}.white{color:#fff}.hmcts-currency-input__symbol{font-family:nta,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px;line-height:initial;position:absolute;font-weight:200;padding:8px 10px;height:40px;box-sizing:border-box;background-color:#dee0e2;border:2px solid #0b0c0c}\n"], dependencies: [{ kind: "ngmodule", type: i0.forwardRef(() => CommonModule) }, { kind: "directive", type: i0.forwardRef(() => i3.NgClass), selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i0.forwardRef(() => i3.NgForOf), selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i0.forwardRef(() => i3.NgIf), selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i0.forwardRef(() => AddRemissionComponent), selector: "ccpay-add-remission", inputs: ["fee", "fees", "payment", "remission", "ccdCaseNumber", "caseType", "viewCompStatus", "paymentGroupRef", "isTurnOff", "isRefundRemission", "isStrategicFixEnable", "paidAmount", "isFromRefundListPage", "isFromPaymentDetailPage", "isFromServiceRequestPage", "isFullyRefund", "feeamount", "refundPaymentReference", "isFromRefundStatusPage", "changeRefundReason", "isServiceRequest", "LOGGEDINUSERROLES", "orderDetail", "orderRef", "orderStatus", "orderParty", "orderCreated", "orderCCDEvent", "takepayment", "orderFeesTotal", "orderTotalPayments", "orderRemissionTotal"], outputs: ["cancelRemission", "refundListReason", "refundListAmount", "refundFees"] }, { kind: "component", type: i0.forwardRef(() => StatusHistoryComponent), selector: "ccpay-payment-statuses", inputs: ["isTakePayment"] }, { kind: "component", type: i0.forwardRef(() => ServiceRequestComponent), selector: "ccpay-service-request", inputs: ["LOGGEDINUSERROLES", "viewStatus", "orderDetail", "orderRef", "orderStatus", "orderParty", "orderCreated", "orderCCDEvent", "orderFeesTotal", "orderTotalPayments", "orderRemissionTotal", "paymentGroupList", "takePayment", "ccdCaseNumber", "isServiceRequest"], outputs: ["goToServiceRquestComponent"] }, { kind: "component", type: i0.forwardRef(() => ContactDetailsComponent), selector: "ccpay-contact-details", inputs: ["isEditOperation", "isEditOperationInRefundList", "addressObj"], outputs: ["assignContactDetails", "assignContactDetailsInFefundsList", "redirectToIssueRefund"] }, { kind: "component", type: i0.forwardRef(() => NotificationPreviewComponent), selector: "app-notification-preview", inputs: ["payment", "contactDetails", "refundReason", "refundAmount", "paymentReference", "refundReference", "previewJourney", "notificationSent"], outputs: ["notificationPreviewEvent"] }, { kind: "ngmodule", type: i0.forwardRef(() => RpxTranslationModule) }, { kind: "pipe", type: i0.forwardRef(() => i3.DecimalPipe), name: "number" }, { kind: "pipe", type: i0.forwardRef(() => i3.CurrencyPipe), name: "currency" }, { kind: "pipe", type: i0.forwardRef(() => i3.DatePipe), name: "date" }, { kind: "pipe", type: i0.forwardRef(() => CcdHyphensPipe), name: "ccdHyphens" }, { kind: "pipe", type: i0.forwardRef(() => CapitalizePipe), name: "capitalize" }, { kind: "pipe", type: i0.forwardRef(() => i8.RpxTranslatePipe), name: "rpxTranslate" }] });
5136
5150
  }
5137
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: PaymentViewComponent, decorators: [{
5151
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: PaymentViewComponent, decorators: [{
5138
5152
  type: Component,
5139
5153
  args: [{ selector: 'ccpay-payment-view', providers: [{ provide: 'PAYMENT_VIEW', useExisting: forwardRef(() => PaymentViewComponent) }], imports: [
5140
5154
  CommonModule, forwardRef(() => AddRemissionComponent),
@@ -5346,10 +5360,10 @@ class PbaPaymentComponent {
5346
5360
  this.paymentLibComponent.ISBSENABLE = true;
5347
5361
  this.paymentLibComponent.isFromServiceRequestPage = true;
5348
5362
  }
5349
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: PbaPaymentComponent, deps: [{ token: 'PAYMENT_LIB' }, { token: PaymentViewService }], target: i0.ɵɵFactoryTarget.Component });
5350
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.1", type: PbaPaymentComponent, isStandalone: true, selector: "ccpay-pba-payment", inputs: { pbaPayOrderRef: "pbaPayOrderRef" }, ngImport: i0, template: "<ng-container *ngIf=\"viewStatus === 'pba-payment'\">\n\n <div class=\"govuk-breadcrumbs\" *ngIf=\"!errorMsg && !isPBAAccountPaymentSuccess && !isCardPaymentSuccess\">\n <ol class=\"govuk-breadcrumbs__list\">\n <li class=\"govuk-breadcrumbs__list-item\">\n <a href=\"javascript:void(0)\" (click)=\"gotoCasetransationPage()\" class=\"govuk-back-link pba-payments-16-font\">Back</a>\n </li>\n </ol>\n </div>\n <div class=\"pba-payment\" *ngIf=\"(pbaAccountList?.length > 0 || errorMsg) && !isInSufficiantFund && !isPBAAccountNotExist && !isPBAServerError && !isPBAAccountHold && !isPBAAccountPaymentSuccess && isCardPaymentSuccess\">\n\n <div *ngIf=\"errorMsg\" class=\"govuk-error-summary pba-payments-error-box--size\" aria-labelledby=\"error-summary-title\" >\n <h2 class=\"govuk-error-summary__title govuk-error-summary__title-custom pba-payments-24-font\" id=\"error-summary-title\">\n {{ \"There is a problem\" | rpxTranslate }}\n </h2>\n <div class=\"govuk-error-summary__body\">\n <ul class=\"govuk-list govuk-error-summary__list\">\n <li class=\"pba-payments-error-16-font\">\n {{ \"Your PBA account cannot be found.\" | rpxTranslate }}\n </li>\n <li class=\"pba-payments-error-16-font\">\n {{ \"If you know your organisation has a PBA, try again.\" | rpxTranslate : {pba: \"PBA\"} }}\n </li>\n <li class=\"pba-payments-error-16-font\">\n {{ \"You can also pay by credit or debit card.\" | rpxTranslate }}\n </li>\n </ul>\n </div>\n </div>\n <!-- <h1 class=\"heading-medium margin-top-10-px\">Pay fee using Payment by Account (PBA)</h1> -->\n <div class=\"govuk-form-group margin-top-10-px\">\n <label class=\"govuk-label pba-payments-govuk__label pba-payments-19-font\">\n {{ \"Amount to pay\" | rpxTranslate }}\n </label>\n <span class=\"pba-payments-19-font\">{{pbaPayOrderRef.orderTotalFees | currency :'GBP':'symbol':'1.2-2'}}</span>\n </div>\n\n <div class=\"govuk-form-group\" *ngIf=\"!errorMsg\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"contact-hint\">\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"pbaAccount\" name=\"paymentSelection\" type=\"radio\" value=\"PBA\" (click)=\"selectPaymentMethod('PBA')\" data-aria-controls=\"pba-account\">\n <label class=\"govuk-label govuk-radios__label pba-payments-19-font pba-payments-font-bld\" for=\"pbaAccount\">\n {{ \"Pay fee using Payment by Account (PBA)\" | rpxTranslate: {pba: \"(PBA)\"} }}\n </label>\n </div>\n <div class=\"govuk-radios__conditional\" id=\"conditional-contact\" *ngIf=\"isPbaAccountSelected\">\n <div class=\"govuk-form-group pba-payments-select-box--size\">\n <label class=\"govuk-label pba-payments-govuk__label pba-payments-19-font\" for=\"pbaAccountNumber\">\n {{ \"Select a PBA\" | rpxTranslate: {pba: \"PBA\"} }}\n </label>\n <select class=\"form-control short-input\" id=\"pbaAccountNumber\" (change)=\"selectpbaaccount($event)\">\n <option value=\"\" selected='selected'>{{ \"Select option\" | rpxTranslate }}</option>\n <option *ngFor=\"let pbaAccount of pbaAccountList;\" value=\"{{pbaAccount}}\">{{pbaAccount}}</option>\n </select>\n </div>\n <div class=\"govuk-form-group\" *ngIf=\"!errorMsg && selectedPbaAccount\">\n <label class=\"govuk-label pba-payments-govuk__label pba-payments-24-font\" for=\"pbaAccountNumber\">\n {{ \"Enter a reference for your PBA account statements\" | rpxTranslate: {pba: \"PBA\"} }}\n </label>\n <div id=\"event-name-hint\" class=\"govuk-hint pba-payments-19-font pba-payment-width\">\n {{ \"This should be your own unique reference to identify the case. It will appear on your statements.\" | rpxTranslate }}\n </div>\n <input class=\"govuk-input pba-payments-ref-box--size pba-payments-19-font\" id=\"pbaAccountRef\" (change)=\"selectpbaaccount($event)\" (keyup)=\"selectpbaaccount($event)\" name=\"pbaAccountRef\" type=\"text\" aria-describedby=\"pbaAccountRef-hint\">\n </div>\n\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"cardPayment\" name=\"paymentSelection\" type=\"radio\" value=\"card\" (click)=\"selectPaymentMethod('CARD')\" data-aria-controls=\"card-payment\">\n <label class=\"govuk-label govuk-radios__label pba-payments-19-font pba-payments-font-bld\" for=\"cardPayment\">\n {{ \"Pay by credit or debit card\" | rpxTranslate }}\n </label>\n </div>\n </div>\n </fieldset>\n </div>\n\n <div class=\"govuk-button--group\" *ngIf=\"errorMsg\">\n <button type=\"button\" class=\"button pba-payments-19-font govuk-button--secondary pba-payments-margin-10\" (click)=\"gotoCasetransationPage()\">\n {{ \"View Service Request\" | rpxTranslate }}\n </button>\n <button type=\"submit\" class=\"button pba-payments-19-font pba-payments-20-margin\" (click)=\"cardPayment()\">\n {{ \"Pay by card\" | rpxTranslate }}\n </button>\n </div>\n <div class=\"govuk-button--group\" *ngIf=\"!errorMsg\">\n <button type=\"submit\" [disabled]=\"isContinueButtondisabled\" class=\"button pba-payments-19-font pba-payments-20-margin\" (click)=\"saveAndContinue()\">\n <span *ngIf=\"!isPBADropdownSelected\" class=\"white\">{{ \"Continue\" | rpxTranslate }}</span>\n <span *ngIf=\"isPBADropdownSelected\" class=\"white\">{{ \"Confirm payment\" | rpxTranslate }}</span>\n </button>\n </div>\n </div>\n<ng-container *ngIf=\"pbaAccountList?.length <= 0 && !errorMsg && isGetPBAAccountSucceed && isCardPaymentSuccess\">\n <div class=\"govuk-width-container\">\n <main class=\"govuk-main-wrapper govuk-main-wrapper--l\" id=\"main-content\" role=\"main\">\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-warning-text\">\n <span class=\"govuk-warning-text__icon\" aria-hidden=\"true\">!</span>\n <strong class=\"govuk-warning-text__text\">\n <span class=\"govuk-warning-text__assistive\">{{ \"Warning\" | rpxTranslate }}</span>\n <h2 class=\"warning-heading-m\">{{ \"You don\u2019t have a registered PBA.\" | rpxTranslate: {pba: \"PBA\"} }}</h2>\n </strong>\n </div>\n <div class=\"pba-payments-margin-top-10\">\n <h2 class=\"heading-medium\">{{ \"Pay by credit or debit card\" | rpxTranslate }}</h2>\n <p class=\"govuk-body pba-payments-19-font\">\n {{ \"We recommend that you apply to get a new PBA to pay for fees.\" | rpxTranslate }}\n </p>\n <p class=\"govuk-bod ypba-payments-19-font\">\n {{ \"you can also pay by credit or debit card if you need to pay now\" | rpxTranslate }}\n </p>\n <p class=\"govuk-body\">\n <button type=\"submit\" (click)=\"cardPayment()\" class=\"button pba-payments-19-font pba-payments-20-margin\">\n {{ \"Pay by card\" | rpxTranslate }}\n </button>\n </p>\n\n </div>\n <div class=\"pba-payments-margin-top-10\">\n <h2 class=\"heading-medium\">{{ \"Register an existing PBA with MyHMCTS\" | rpxTranslate: {pba: \"PBA\", myhmcts: \"MyHMCTS\"} }}</h2>\n <p class=\"govuk-body pba-payments-19-font\">\n {{ \"You may find it easier in future to pay by PBA, your organisation administrator will need to\n email\" | rpxTranslate: {pba: \"PBA\"} }} <a href=\"mailto: MyHMCTSsupport@justice.gov.uk\">MyHMCTSsupport&#64;justice.gov.uk</a>{{ \"to ask for your PBA to be registered with your\n MyHMCTS account. You should include your organisation name and PBA number.\" | rpxTranslate: {pba: \"PBA\", myhmcts: \"MyHMCTS\"} }}\n </p>\n <p class=\"govuk-body pba-payments-19-font\">\n {{ \"It can then take up to 3 days for your account to be updated. You\u2019ll need to start your claim\n again to pay the fee.\" | rpxTranslate }}\n </p>\n </div>\n <div class=\"pba-payments-margin-top-10\">\n <h2 class=\"heading-medium\">{{ \"Apply to get a new PBA\" | rpxTranslate: {pba: \"PBA\"} }}</h2>\n <p class=\"govuk-body pba-payments-19-font\">\n {{ \"You\u2019ll need to provide details for you and your organisation, including the required credit\n limit for your account.\" | rpxTranslate }}\n </p>\n <p class=\"govuk-body pba-payments-19-font\">\n {{ \"Once your account has been registered, you\u2019ll need to start your claim again to pay the fee.\" | rpxTranslate }}\n </p>\n <p class=\"govuk-body pba-payments-19-font\">\n {{ \"Read more information on\" | rpxTranslate }} <a target=\"_blank\" href=\"https://www.gov.uk/guidance/hmcts-payment-by-account-for-online-services\">{{ \"registering for PBA\" | rpxTranslate: {pba: \"PBA\"} }}</a>.\n </p>\n </div>\n </div>\n </main>\n </div>\n</ng-container>\n\n<ng-container *ngIf=\"isInSufficiantFund && isCardPaymentSuccess\">\n <div class=\"govuk-width-container\">\n <main class=\"govuk-main-wrapper govuk-main-wrapper--l\" id=\"main-content\" role=\"main\">\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-error-summary pba-payments-error-box--size\" aria-labelledby=\"error-summary-title\">\n <h2 class=\"govuk-error-summary__title govuk-error-summary__title-custom pba-payments-24-font\" id=\"error-summary-title\">\n {{ \"There is a problem\" | rpxTranslate }}\n </h2>\n <div class=\"govuk-error-summary__body\">\n <ul class=\"govuk-list govuk-error-summary__list\">\n <li class=\"pba-payments-error-16-font\">\n {{ \"You don't have enough funds in your PBA account to pay for this fee.\" | rpxTranslate }}\n </li>\n <li class=\"pba-payments-error-16-font\">\n {{ \"If you have already topped up your PBA account, wait up to 24 hours for the new balance to become available.\" | rpxTranslate: {pba: \"PBA\", number: \"24\"} }}\n </li>\n </ul>\n </div>\n </div>\n <div class=\"pba-payments-margin-top-10\">\n <h2 class=\"heading-medium\">{{ \"Should you need any further advice\" | rpxTranslate }}</h2>\n <p class=\"govuk-body pba-payments-19-font\">\n {{ \"Email\" | rpxTranslate }} <a href=\"mailto:MiddleOffice.DDservices@liberata.com\">MiddleOffice.DDservices&#64;liberata.com</a> {{ \"or call\" | rpxTranslate }} <a href=\"tel:01633-652-125\">01633 652 125</a> ({{ \"option\" | rpxTranslate }} 3) {{ \"to try to fix the issue.\" | rpxTranslate }}\n </p>\n <p class=\"govuk-body pba-payments-19-font\">\n {{ \"you can also pay by credit or debit card.\" | rpxTranslate }}\n </p>\n <div class=\"govuk-button--group\">\n <button type=\"button\" class=\"button pba-payments-19-font govuk-button--secondary pba-payments-margin-10\" (click)=\"gotoCasetransationPage()\">\n {{ \"View Service Request\" | rpxTranslate }}\n </button>\n <button type=\"submit\" class=\"button pba-payments-19-font pba-payments-20-margin\" (click)=\"cardPayment()\">\n {{ \"Pay by card\" | rpxTranslate }}\n </button>\n </div>\n </div>\n </div>\n </main>\n </div>\n</ng-container>\n<ng-container *ngIf=\"isPBAAccountNotExist && isCardPaymentSuccess\">\n <div class=\"govuk-width-container\">\n <main class=\"govuk-main-wrapper govuk-main-wrapper--l\" id=\"main-content\" role=\"main\">\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-error-summary pba-payments-error-box--size\" aria-labelledby=\"error-summary-title\">\n <h2 class=\"govuk-error-summary__title govuk-error-summary__title-custom pba-payments-24-font\" id=\"error-summary-title\">\n {{ \"There is a problem\" | rpxTranslate }}\n </h2>\n <div class=\"govuk-error-summary__body\">\n <ul class=\"govuk-list govuk-error-summary__list\">\n <li class=\"pba-payments-error-16-font\">\n ({{ \"Your PBA account\" | rpxTranslate: {pba: \"PBA\"} }}) ({{ selectedPbaAccount }}) ({{ \"no longer exists.\" | rpxTranslate }})\n </li>\n </ul>\n </div>\n </div>\n <div class=\"pba-payments-margin-top-10\">\n <h2 class=\"heading-medium\">{{ \"Should you need any further advice\" | rpxTranslate }}</h2>\n <p class=\"govuk-body pba-payments-19-font govuk-body-width\">\n {{ \"Email\" | rpxTranslate }} <a href=\"mailto:MiddleOffice.DDservices@liberata.com\">MiddleOffice.DDservices&#64;liberata.com</a> {{ \"or call\" | rpxTranslate }} <a href=\"tel:01633-652-125\">01633 652 125</a> ({{ \"option\" | rpxTranslate }} 3) {{ \"to try to fix the issue.\" | rpxTranslate }}\n </p>\n <p class=\"govuk-body pba-payments-19-font\">\n {{ \"you can also pay by credit or debit card.\" | rpxTranslate }}\n </p>\n <div class=\"govuk-button--group\">\n <button type=\"button\" class=\"button pba-payments-19-font govuk-button--secondary pba-payments-margin-10\" (click)=\"gotoCasetransationPage()\">\n {{ \"View Service Request\" | rpxTranslate }}\n </button>\n <button type=\"submit\" class=\"button pba-payments-19-font pba-payments-20-margin\" (click)=\"cardPayment()\">\n {{ \"Pay by card\" | rpxTranslate }}\n </button>\n </div>\n </div>\n </div>\n </main>\n </div>\n</ng-container>\n<ng-container *ngIf=\"isPBAAccountHold && isCardPaymentSuccess\">\n <div class=\"govuk-width-container\">\n <main class=\"govuk-main-wrapper govuk-main-wrapper--l\" id=\"main-content\" role=\"main\">\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-error-summary pba-payments-error-box--size\" aria-labelledby=\"error-summary-title\">\n <h2 class=\"govuk-error-summary__title govuk-error-summary__title-custom pba-payments-24-font\" id=\"error-summary-title\">\n {{ \"There is a problem\" | rpxTranslate }}\n </h2>\n <div class=\"govuk-error-summary__body\">\n <ul class=\"govuk-list govuk-error-summary__list\">\n <li class=\"pba-payments-error-16-font\">\n {{ \"Your PBA account \" | rpxTranslate: {pba: \"PBA\"} }} ({{selectedPbaAccount}}) {{ \" has been put on hold.\" | rpxTranslate }}\n </li>\n </ul>\n </div>\n </div>\n <div class=\"pba-payments-margin-top-10\">\n <h2 class=\"heading-medium\">{{ \"Should you need any further advice\" | rpxTranslate }}</h2>\n <p class=\"govuk-body pba-payments-19-font govuk-body-width\">\n {{ \"Email\" | rpxTranslate }} <a href=\"mailto:MiddleOffice.DDservices@liberata.com\">MiddleOffice.DDservices&#64;liberata.com</a> {{ \"or call\" | rpxTranslate }} <a href=\"tel:01633-652-125\">01633 652 125</a> ({{ \"option\" | rpxTranslate }} 3) {{ \"to try to fix the issue.\" | rpxTranslate }}\n </p>\n <p class=\"govuk-body pba-payments-19-font\">\n {{ \"you can also pay by credit or debit card.\" | rpxTranslate }}\n </p>\n <div class=\"govuk-button--group\">\n <button type=\"button\" class=\"button pba-payments-19-font govuk-button--secondary pba-payments-margin-10\" (click)=\"gotoCasetransationPage()\">\n {{ \"View Service Request\" | rpxTranslate }}\n </button>\n <button type=\"submit\" class=\"button pba-payments-19-font pba-payments-20-margin\" (click)=\"cardPayment()\">\n {{ \"Pay by card\" | rpxTranslate }}\n </button>\n </div>\n </div>\n </div>\n </main>\n </div>\n</ng-container>\n<ng-container *ngIf=\"isPBAServerError && isCardPaymentSuccess\">\n <div class=\"govuk-width-container\">\n <main class=\"govuk-main-wrapper govuk-main-wrapper--l\" id=\"main-content\" role=\"main\">\n <div class=\"govuk-grid-row\">\n <div class=\"pba-payments-margin-top-10\">\n <h2 class=\"pba-payments-heading-lg\">{{ \"Sorry, there is a problem with the service\" | rpxTranslate }}</h2>\n <p class=\"govuk-body pba-payments-19-font\">\n {{ \"Try again later.\" | rpxTranslate }}\n </p>\n <p class=\"govuk-body pba-payments-19-font\">\n {{ \"you can also pay by credit or debit card.\" | rpxTranslate }}\n </p>\n <div class=\"govuk-button--group\">\n <button type=\"button\" class=\"button pba-payments-19-font govuk-button--secondary pba-payments-margin-10\" (click)=\"gotoCasetransationPage()\">\n {{ \"View Service Request\" | rpxTranslate }}\n </button>\n <button type=\"submit\" class=\"button pba-payments-19-font pba-payments-20-margin\" (click)=\"cardPayment()\">\n {{ \"Pay by card\" | rpxTranslate }}\n </button>\n </div>\n </div>\n </div>\n </main>\n </div>\n</ng-container>\n\n<ng-container *ngIf=\"isPBAAccountPaymentSuccess && isCardPaymentSuccess\">\n <div class=\"govuk-width-container\">\n <main class=\"govuk-main-wrapper govuk-main-wrapper--l\" id=\"main-content\" role=\"main\">\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-panel govuk-panel--confirmation pba-payments--confirmation\">\n <h1 class=\"govuk-panel__title pba-payments--title white\">\n {{ \"Payment successful\" | rpxTranslate }}\n </h1>\n <div class=\"govuk-panel__body pba-payments__body white\">\n {{ \"Your payment reference is\" | rpxTranslate }} <br><strong class=\"white\">{{pbaAccountrPaymentResult.payment_reference}}</strong>\n </div>\n </div>\n <p class=\"govuk-body pba-payments-19-font\">\n <a href=\"javascript:void(0)\" (click)=\"gotoCasetransationPage()\">{{ \"View service requests\" | rpxTranslate }}</a>\n </p>\n </div>\n </main>\n </div>\n</ng-container>\n\n<ng-container *ngIf=\"!isCardPaymentSuccess\">\n <div class=\"govuk-width-container\">\n <main class=\"govuk-main-wrapper govuk-main-wrapper--l\" id=\"main-content\" role=\"main\">\n <div class=\"govuk-grid-row\">\n <div class=\"pba-payments-margin-top-10\">\n <h2 class=\"pba-payments-heading-lg\">{{ \"Sorry, there is a problem with the service\" | rpxTranslate }}</h2>\n <p class=\"govuk-body pba-payments-19-font\">\n {{ \"Try again later.\" | rpxTranslate }}\n </p>\n <!-- <p class=\"govuk-body pba-payments-19-font\">\n you can also <a href=\"javascript:void(0)\" (click)=\"cardPayment()\" >pay by credit or debit card</a>.\n </p> -->\n <p class=\"govuk-body pba-payments-19-font\">\n <a href=\"javascript:void(0)\" (click)=\"gotoCasetransationPage()\">{{ \"View service requests\" | rpxTranslate }}</a>\n </p>\n </div>\n </div>\n </main>\n </div>\n</ng-container>\n</ng-container>\n\n\n\n", styles: [".pba-payments-govuk__label{font-weight:700;line-height:1.31578947}.pba-payments-19-font{font-size:19px}.pba-payments-font-bld{font-weight:700}.pba-payments-16-font{font-size:16px}.pba-payments-24-font{font-size:24px}.pba-payments-20-margin{margin-bottom:20px}.pba-payments-select-box--size{width:40%}.pba-payments-error-box--size{width:80%}.pba-payments-ref-box--size{width:60%}.pba-payments-error-16-font{font-size:16px;line-height:34px}.pba-payments-margin-10{margin-right:10px}.pba-payments-margin-top-10{margin-top:15px}.pba-payments-heading-lg{font-size:40px;font-weight:700;line-height:72px}.pba-payments--confirmation{background:#00703c!important}.pba-payments__body{font-size:36px!important}.pba-payments--title{font-size:48px!important}.warning-heading-m{font-size:29px;font-weight:700}.pba-payment-width{width:75%}.margin-top-10-px{margin-top:10px}.govuk-error-summary:focus{outline:3px solid #ffdd00}.govuk-body-width{width:750px}.white{color:#fff}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: RpxTranslationModule }, { kind: "pipe", type: i3.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i8.RpxTranslatePipe, name: "rpxTranslate" }] });
5363
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: PbaPaymentComponent, deps: [{ token: 'PAYMENT_LIB' }, { token: PaymentViewService }], target: i0.ɵɵFactoryTarget.Component });
5364
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: PbaPaymentComponent, isStandalone: true, selector: "ccpay-pba-payment", inputs: { pbaPayOrderRef: "pbaPayOrderRef" }, ngImport: i0, template: "<ng-container *ngIf=\"viewStatus === 'pba-payment'\">\n\n <div class=\"govuk-breadcrumbs\" *ngIf=\"!errorMsg && !isPBAAccountPaymentSuccess && !isCardPaymentSuccess\">\n <ol class=\"govuk-breadcrumbs__list\">\n <li class=\"govuk-breadcrumbs__list-item\">\n <a href=\"javascript:void(0)\" (click)=\"gotoCasetransationPage()\" class=\"govuk-back-link pba-payments-16-font\">Back</a>\n </li>\n </ol>\n </div>\n <div class=\"pba-payment\" *ngIf=\"(pbaAccountList?.length > 0 || errorMsg) && !isInSufficiantFund && !isPBAAccountNotExist && !isPBAServerError && !isPBAAccountHold && !isPBAAccountPaymentSuccess && isCardPaymentSuccess\">\n\n <div *ngIf=\"errorMsg\" class=\"govuk-error-summary pba-payments-error-box--size\" aria-labelledby=\"error-summary-title\" >\n <h2 class=\"govuk-error-summary__title govuk-error-summary__title-custom pba-payments-24-font\" id=\"error-summary-title\">\n {{ \"There is a problem\" | rpxTranslate }}\n </h2>\n <div class=\"govuk-error-summary__body\">\n <ul class=\"govuk-list govuk-error-summary__list\">\n <li class=\"pba-payments-error-16-font\">\n {{ \"Your PBA account cannot be found.\" | rpxTranslate }}\n </li>\n <li class=\"pba-payments-error-16-font\">\n {{ \"If you know your organisation has a PBA, try again.\" | rpxTranslate : {pba: \"PBA\"} }}\n </li>\n <li class=\"pba-payments-error-16-font\">\n {{ \"You can also pay by credit or debit card.\" | rpxTranslate }}\n </li>\n </ul>\n </div>\n </div>\n <!-- <h1 class=\"heading-medium margin-top-10-px\">Pay fee using Payment by Account (PBA)</h1> -->\n <div class=\"govuk-form-group margin-top-10-px\">\n <label class=\"govuk-label pba-payments-govuk__label pba-payments-19-font\">\n {{ \"Amount to pay\" | rpxTranslate }}\n </label>\n <span class=\"pba-payments-19-font\">{{pbaPayOrderRef.orderTotalFees | currency :'GBP':'symbol':'1.2-2'}}</span>\n </div>\n\n <div class=\"govuk-form-group\" *ngIf=\"!errorMsg\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"contact-hint\">\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"pbaAccount\" name=\"paymentSelection\" type=\"radio\" value=\"PBA\" (click)=\"selectPaymentMethod('PBA')\" data-aria-controls=\"pba-account\">\n <label class=\"govuk-label govuk-radios__label pba-payments-19-font pba-payments-font-bld\" for=\"pbaAccount\">\n {{ \"Pay fee using Payment by Account (PBA)\" | rpxTranslate: {pba: \"(PBA)\"} }}\n </label>\n </div>\n <div class=\"govuk-radios__conditional\" id=\"conditional-contact\" *ngIf=\"isPbaAccountSelected\">\n <div class=\"govuk-form-group pba-payments-select-box--size\">\n <label class=\"govuk-label pba-payments-govuk__label pba-payments-19-font\" for=\"pbaAccountNumber\">\n {{ \"Select a PBA\" | rpxTranslate: {pba: \"PBA\"} }}\n </label>\n <select class=\"form-control short-input\" id=\"pbaAccountNumber\" (change)=\"selectpbaaccount($event)\">\n <option value=\"\" selected='selected'>{{ \"Select option\" | rpxTranslate }}</option>\n <option *ngFor=\"let pbaAccount of pbaAccountList;\" value=\"{{pbaAccount}}\">{{pbaAccount}}</option>\n </select>\n </div>\n <div class=\"govuk-form-group\" *ngIf=\"!errorMsg && selectedPbaAccount\">\n <label class=\"govuk-label pba-payments-govuk__label pba-payments-24-font\" for=\"pbaAccountNumber\">\n {{ \"Enter a reference for your PBA account statements\" | rpxTranslate: {pba: \"PBA\"} }}\n </label>\n <div id=\"event-name-hint\" class=\"govuk-hint pba-payments-19-font pba-payment-width\">\n {{ \"This should be your own unique reference to identify the case. It will appear on your statements.\" | rpxTranslate }}\n </div>\n <input class=\"govuk-input pba-payments-ref-box--size pba-payments-19-font\" id=\"pbaAccountRef\" (change)=\"selectpbaaccount($event)\" (keyup)=\"selectpbaaccount($event)\" name=\"pbaAccountRef\" type=\"text\" aria-describedby=\"pbaAccountRef-hint\">\n </div>\n\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"cardPayment\" name=\"paymentSelection\" type=\"radio\" value=\"card\" (click)=\"selectPaymentMethod('CARD')\" data-aria-controls=\"card-payment\">\n <label class=\"govuk-label govuk-radios__label pba-payments-19-font pba-payments-font-bld\" for=\"cardPayment\">\n {{ \"Pay by credit or debit card\" | rpxTranslate }}\n </label>\n </div>\n </div>\n </fieldset>\n </div>\n\n <div class=\"govuk-button--group\" *ngIf=\"errorMsg\">\n <button type=\"button\" class=\"button pba-payments-19-font govuk-button--secondary pba-payments-margin-10\" (click)=\"gotoCasetransationPage()\">\n {{ \"View Service Request\" | rpxTranslate }}\n </button>\n <button type=\"submit\" class=\"button pba-payments-19-font pba-payments-20-margin\" (click)=\"cardPayment()\">\n {{ \"Pay by card\" | rpxTranslate }}\n </button>\n </div>\n <div class=\"govuk-button--group\" *ngIf=\"!errorMsg\">\n <button type=\"submit\" [disabled]=\"isContinueButtondisabled\" class=\"button pba-payments-19-font pba-payments-20-margin\" (click)=\"saveAndContinue()\">\n <span *ngIf=\"!isPBADropdownSelected\" class=\"white\">{{ \"Continue\" | rpxTranslate }}</span>\n <span *ngIf=\"isPBADropdownSelected\" class=\"white\">{{ \"Confirm payment\" | rpxTranslate }}</span>\n </button>\n </div>\n </div>\n<ng-container *ngIf=\"pbaAccountList?.length <= 0 && !errorMsg && isGetPBAAccountSucceed && isCardPaymentSuccess\">\n <div class=\"govuk-width-container\">\n <main class=\"govuk-main-wrapper govuk-main-wrapper--l\" id=\"main-content\" role=\"main\">\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-warning-text\">\n <span class=\"govuk-warning-text__icon\" aria-hidden=\"true\">!</span>\n <strong class=\"govuk-warning-text__text\">\n <span class=\"govuk-warning-text__assistive\">{{ \"Warning\" | rpxTranslate }}</span>\n <h2 class=\"warning-heading-m\">{{ \"You don\u2019t have a registered PBA.\" | rpxTranslate: {pba: \"PBA\"} }}</h2>\n </strong>\n </div>\n <div class=\"pba-payments-margin-top-10\">\n <h2 class=\"heading-medium\">{{ \"Pay by credit or debit card\" | rpxTranslate }}</h2>\n <p class=\"govuk-body pba-payments-19-font\">\n {{ \"We recommend that you apply to get a new PBA to pay for fees.\" | rpxTranslate }}\n </p>\n <p class=\"govuk-bod ypba-payments-19-font\">\n {{ \"you can also pay by credit or debit card if you need to pay now\" | rpxTranslate }}\n </p>\n <p class=\"govuk-body\">\n <button type=\"submit\" (click)=\"cardPayment()\" class=\"button pba-payments-19-font pba-payments-20-margin\">\n {{ \"Pay by card\" | rpxTranslate }}\n </button>\n </p>\n\n </div>\n <div class=\"pba-payments-margin-top-10\">\n <h2 class=\"heading-medium\">{{ \"Register an existing PBA with MyHMCTS\" | rpxTranslate: {pba: \"PBA\", myhmcts: \"MyHMCTS\"} }}</h2>\n <p class=\"govuk-body pba-payments-19-font\">\n {{ \"You may find it easier in future to pay by PBA, your organisation administrator will need to\n email\" | rpxTranslate: {pba: \"PBA\"} }} <a href=\"mailto: MyHMCTSsupport@justice.gov.uk\">MyHMCTSsupport&#64;justice.gov.uk</a>{{ \"to ask for your PBA to be registered with your\n MyHMCTS account. You should include your organisation name and PBA number.\" | rpxTranslate: {pba: \"PBA\", myhmcts: \"MyHMCTS\"} }}\n </p>\n <p class=\"govuk-body pba-payments-19-font\">\n {{ \"It can then take up to 3 days for your account to be updated. You\u2019ll need to start your claim\n again to pay the fee.\" | rpxTranslate }}\n </p>\n </div>\n <div class=\"pba-payments-margin-top-10\">\n <h2 class=\"heading-medium\">{{ \"Apply to get a new PBA\" | rpxTranslate: {pba: \"PBA\"} }}</h2>\n <p class=\"govuk-body pba-payments-19-font\">\n {{ \"You\u2019ll need to provide details for you and your organisation, including the required credit\n limit for your account.\" | rpxTranslate }}\n </p>\n <p class=\"govuk-body pba-payments-19-font\">\n {{ \"Once your account has been registered, you\u2019ll need to start your claim again to pay the fee.\" | rpxTranslate }}\n </p>\n <p class=\"govuk-body pba-payments-19-font\">\n {{ \"Read more information on\" | rpxTranslate }} <a target=\"_blank\" href=\"https://www.gov.uk/guidance/hmcts-payment-by-account-for-online-services\">{{ \"registering for PBA\" | rpxTranslate: {pba: \"PBA\"} }}</a>.\n </p>\n </div>\n </div>\n </main>\n </div>\n</ng-container>\n\n<ng-container *ngIf=\"isInSufficiantFund && isCardPaymentSuccess\">\n <div class=\"govuk-width-container\">\n <main class=\"govuk-main-wrapper govuk-main-wrapper--l\" id=\"main-content\" role=\"main\">\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-error-summary pba-payments-error-box--size\" aria-labelledby=\"error-summary-title\">\n <h2 class=\"govuk-error-summary__title govuk-error-summary__title-custom pba-payments-24-font\" id=\"error-summary-title\">\n {{ \"There is a problem\" | rpxTranslate }}\n </h2>\n <div class=\"govuk-error-summary__body\">\n <ul class=\"govuk-list govuk-error-summary__list\">\n <li class=\"pba-payments-error-16-font\">\n {{ \"You don't have enough funds in your PBA account to pay for this fee.\" | rpxTranslate }}\n </li>\n <li class=\"pba-payments-error-16-font\">\n {{ \"If you have already topped up your PBA account, wait up to 24 hours for the new balance to become available.\" | rpxTranslate: {pba: \"PBA\", number: \"24\"} }}\n </li>\n </ul>\n </div>\n </div>\n <div class=\"pba-payments-margin-top-10\">\n <h2 class=\"heading-medium\">{{ \"Should you need any further advice\" | rpxTranslate }}</h2>\n <p class=\"govuk-body pba-payments-19-font\">\n {{ \"Email\" | rpxTranslate }} <a href=\"mailto:MiddleOffice.DDservices@liberata.com\">MiddleOffice.DDservices&#64;liberata.com</a> {{ \"or call\" | rpxTranslate }} <a href=\"tel:01633-652-125\">01633 652 125</a> ({{ \"option\" | rpxTranslate }} 3) {{ \"to try to fix the issue.\" | rpxTranslate }}\n </p>\n <p class=\"govuk-body pba-payments-19-font\">\n {{ \"you can also pay by credit or debit card.\" | rpxTranslate }}\n </p>\n <div class=\"govuk-button--group\">\n <button type=\"button\" class=\"button pba-payments-19-font govuk-button--secondary pba-payments-margin-10\" (click)=\"gotoCasetransationPage()\">\n {{ \"View Service Request\" | rpxTranslate }}\n </button>\n <button type=\"submit\" class=\"button pba-payments-19-font pba-payments-20-margin\" (click)=\"cardPayment()\">\n {{ \"Pay by card\" | rpxTranslate }}\n </button>\n </div>\n </div>\n </div>\n </main>\n </div>\n</ng-container>\n<ng-container *ngIf=\"isPBAAccountNotExist && isCardPaymentSuccess\">\n <div class=\"govuk-width-container\">\n <main class=\"govuk-main-wrapper govuk-main-wrapper--l\" id=\"main-content\" role=\"main\">\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-error-summary pba-payments-error-box--size\" aria-labelledby=\"error-summary-title\">\n <h2 class=\"govuk-error-summary__title govuk-error-summary__title-custom pba-payments-24-font\" id=\"error-summary-title\">\n {{ \"There is a problem\" | rpxTranslate }}\n </h2>\n <div class=\"govuk-error-summary__body\">\n <ul class=\"govuk-list govuk-error-summary__list\">\n <li class=\"pba-payments-error-16-font\">\n ({{ \"Your PBA account\" | rpxTranslate: {pba: \"PBA\"} }}) ({{ selectedPbaAccount }}) ({{ \"no longer exists.\" | rpxTranslate }})\n </li>\n </ul>\n </div>\n </div>\n <div class=\"pba-payments-margin-top-10\">\n <h2 class=\"heading-medium\">{{ \"Should you need any further advice\" | rpxTranslate }}</h2>\n <p class=\"govuk-body pba-payments-19-font govuk-body-width\">\n {{ \"Email\" | rpxTranslate }} <a href=\"mailto:MiddleOffice.DDservices@liberata.com\">MiddleOffice.DDservices&#64;liberata.com</a> {{ \"or call\" | rpxTranslate }} <a href=\"tel:01633-652-125\">01633 652 125</a> ({{ \"option\" | rpxTranslate }} 3) {{ \"to try to fix the issue.\" | rpxTranslate }}\n </p>\n <p class=\"govuk-body pba-payments-19-font\">\n {{ \"you can also pay by credit or debit card.\" | rpxTranslate }}\n </p>\n <div class=\"govuk-button--group\">\n <button type=\"button\" class=\"button pba-payments-19-font govuk-button--secondary pba-payments-margin-10\" (click)=\"gotoCasetransationPage()\">\n {{ \"View Service Request\" | rpxTranslate }}\n </button>\n <button type=\"submit\" class=\"button pba-payments-19-font pba-payments-20-margin\" (click)=\"cardPayment()\">\n {{ \"Pay by card\" | rpxTranslate }}\n </button>\n </div>\n </div>\n </div>\n </main>\n </div>\n</ng-container>\n<ng-container *ngIf=\"isPBAAccountHold && isCardPaymentSuccess\">\n <div class=\"govuk-width-container\">\n <main class=\"govuk-main-wrapper govuk-main-wrapper--l\" id=\"main-content\" role=\"main\">\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-error-summary pba-payments-error-box--size\" aria-labelledby=\"error-summary-title\">\n <h2 class=\"govuk-error-summary__title govuk-error-summary__title-custom pba-payments-24-font\" id=\"error-summary-title\">\n {{ \"There is a problem\" | rpxTranslate }}\n </h2>\n <div class=\"govuk-error-summary__body\">\n <ul class=\"govuk-list govuk-error-summary__list\">\n <li class=\"pba-payments-error-16-font\">\n {{ \"Your PBA account \" | rpxTranslate: {pba: \"PBA\"} }} ({{selectedPbaAccount}}) {{ \" has been put on hold.\" | rpxTranslate }}\n </li>\n </ul>\n </div>\n </div>\n <div class=\"pba-payments-margin-top-10\">\n <h2 class=\"heading-medium\">{{ \"Should you need any further advice\" | rpxTranslate }}</h2>\n <p class=\"govuk-body pba-payments-19-font govuk-body-width\">\n {{ \"Email\" | rpxTranslate }} <a href=\"mailto:MiddleOffice.DDservices@liberata.com\">MiddleOffice.DDservices&#64;liberata.com</a> {{ \"or call\" | rpxTranslate }} <a href=\"tel:01633-652-125\">01633 652 125</a> ({{ \"option\" | rpxTranslate }} 3) {{ \"to try to fix the issue.\" | rpxTranslate }}\n </p>\n <p class=\"govuk-body pba-payments-19-font\">\n {{ \"you can also pay by credit or debit card.\" | rpxTranslate }}\n </p>\n <div class=\"govuk-button--group\">\n <button type=\"button\" class=\"button pba-payments-19-font govuk-button--secondary pba-payments-margin-10\" (click)=\"gotoCasetransationPage()\">\n {{ \"View Service Request\" | rpxTranslate }}\n </button>\n <button type=\"submit\" class=\"button pba-payments-19-font pba-payments-20-margin\" (click)=\"cardPayment()\">\n {{ \"Pay by card\" | rpxTranslate }}\n </button>\n </div>\n </div>\n </div>\n </main>\n </div>\n</ng-container>\n<ng-container *ngIf=\"isPBAServerError && isCardPaymentSuccess\">\n <div class=\"govuk-width-container\">\n <main class=\"govuk-main-wrapper govuk-main-wrapper--l\" id=\"main-content\" role=\"main\">\n <div class=\"govuk-grid-row\">\n <div class=\"pba-payments-margin-top-10\">\n <h2 class=\"pba-payments-heading-lg\">{{ \"Sorry, there is a problem with the service\" | rpxTranslate }}</h2>\n <p class=\"govuk-body pba-payments-19-font\">\n {{ \"Try again later.\" | rpxTranslate }}\n </p>\n <p class=\"govuk-body pba-payments-19-font\">\n {{ \"you can also pay by credit or debit card.\" | rpxTranslate }}\n </p>\n <div class=\"govuk-button--group\">\n <button type=\"button\" class=\"button pba-payments-19-font govuk-button--secondary pba-payments-margin-10\" (click)=\"gotoCasetransationPage()\">\n {{ \"View Service Request\" | rpxTranslate }}\n </button>\n <button type=\"submit\" class=\"button pba-payments-19-font pba-payments-20-margin\" (click)=\"cardPayment()\">\n {{ \"Pay by card\" | rpxTranslate }}\n </button>\n </div>\n </div>\n </div>\n </main>\n </div>\n</ng-container>\n\n<ng-container *ngIf=\"isPBAAccountPaymentSuccess && isCardPaymentSuccess\">\n <div class=\"govuk-width-container\">\n <main class=\"govuk-main-wrapper govuk-main-wrapper--l\" id=\"main-content\" role=\"main\">\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-panel govuk-panel--confirmation pba-payments--confirmation\">\n <h1 class=\"govuk-panel__title pba-payments--title white\">\n {{ \"Payment successful\" | rpxTranslate }}\n </h1>\n <div class=\"govuk-panel__body pba-payments__body white\">\n {{ \"Your payment reference is\" | rpxTranslate }} <br><strong class=\"white\">{{pbaAccountrPaymentResult.payment_reference}}</strong>\n </div>\n </div>\n <p class=\"govuk-body pba-payments-19-font\">\n <a href=\"javascript:void(0)\" (click)=\"gotoCasetransationPage()\">{{ \"View service requests\" | rpxTranslate }}</a>\n </p>\n </div>\n </main>\n </div>\n</ng-container>\n\n<ng-container *ngIf=\"!isCardPaymentSuccess\">\n <div class=\"govuk-width-container\">\n <main class=\"govuk-main-wrapper govuk-main-wrapper--l\" id=\"main-content\" role=\"main\">\n <div class=\"govuk-grid-row\">\n <div class=\"pba-payments-margin-top-10\">\n <h2 class=\"pba-payments-heading-lg\">{{ \"Sorry, there is a problem with the service\" | rpxTranslate }}</h2>\n <p class=\"govuk-body pba-payments-19-font\">\n {{ \"Try again later.\" | rpxTranslate }}\n </p>\n <!-- <p class=\"govuk-body pba-payments-19-font\">\n you can also <a href=\"javascript:void(0)\" (click)=\"cardPayment()\" >pay by credit or debit card</a>.\n </p> -->\n <p class=\"govuk-body pba-payments-19-font\">\n <a href=\"javascript:void(0)\" (click)=\"gotoCasetransationPage()\">{{ \"View service requests\" | rpxTranslate }}</a>\n </p>\n </div>\n </div>\n </main>\n </div>\n</ng-container>\n</ng-container>\n\n\n\n", styles: [".pba-payments-govuk__label{font-weight:700;line-height:1.31578947}.pba-payments-19-font{font-size:19px}.pba-payments-font-bld{font-weight:700}.pba-payments-16-font{font-size:16px}.pba-payments-24-font{font-size:24px}.pba-payments-20-margin{margin-bottom:20px}.pba-payments-select-box--size{width:40%}.pba-payments-error-box--size{width:80%}.pba-payments-ref-box--size{width:60%}.pba-payments-error-16-font{font-size:16px;line-height:34px}.pba-payments-margin-10{margin-right:10px}.pba-payments-margin-top-10{margin-top:15px}.pba-payments-heading-lg{font-size:40px;font-weight:700;line-height:72px}.pba-payments--confirmation{background:#00703c!important}.pba-payments__body{font-size:36px!important}.pba-payments--title{font-size:48px!important}.warning-heading-m{font-size:29px;font-weight:700}.pba-payment-width{width:75%}.margin-top-10-px{margin-top:10px}.govuk-error-summary:focus{outline:3px solid #ffdd00}.govuk-body-width{width:750px}.white{color:#fff}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: RpxTranslationModule }, { kind: "pipe", type: i3.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i8.RpxTranslatePipe, name: "rpxTranslate" }] });
5351
5365
  }
5352
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: PbaPaymentComponent, decorators: [{
5366
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: PbaPaymentComponent, decorators: [{
5353
5367
  type: Component,
5354
5368
  args: [{ selector: 'ccpay-pba-payment', imports: [
5355
5369
  CommonModule,
@@ -5381,10 +5395,10 @@ class PaymentListService {
5381
5395
  })
5382
5396
  .pipe(catchError(this.errorHandlerService.handleError));
5383
5397
  }
5384
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: PaymentListService, deps: [{ token: i1.HttpClient }, { token: LoggerService }, { token: ErrorHandlerService }, { token: PaymentLibService }], target: i0.ɵɵFactoryTarget.Injectable });
5385
- static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: PaymentListService, providedIn: 'root' });
5398
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: PaymentListService, deps: [{ token: i1.HttpClient }, { token: LoggerService }, { token: ErrorHandlerService }, { token: PaymentLibService }], target: i0.ɵɵFactoryTarget.Injectable });
5399
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: PaymentListService, providedIn: 'root' });
5386
5400
  }
5387
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: PaymentListService, decorators: [{
5401
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: PaymentListService, decorators: [{
5388
5402
  type: Injectable,
5389
5403
  args: [{
5390
5404
  providedIn: 'root'
@@ -5411,10 +5425,10 @@ class PaymentListComponent {
5411
5425
  this.paymentLibComponent.paymentReference = paymentReference;
5412
5426
  this.paymentLibComponent.viewName = 'payment-view';
5413
5427
  }
5414
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: PaymentListComponent, deps: [{ token: PaymentListService }, { token: 'PAYMENT_LIB' }], target: i0.ɵɵFactoryTarget.Component });
5415
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.1", type: PaymentListComponent, isStandalone: false, selector: "ccpay-payment-list", ngImport: i0, template: "<div class=\"govuk-width-container\">\n\n <div *ngIf=\"errorMessage\">\n <div class=\"error-summary\" role=\"group\" aria-labelledby=\"failure-error-summary-heading\" tabindex=\"-1\">\n <h2 class=\"heading-medium error-summary-heading\" id=\"failure-error-summary-heading\">\n Payments list could not be retrieved\n </h2>\n <div class=\"govuk-error-summary__body\">\n {{ errorMessage }}\n </div>\n </div>\n </div>\n\n <div *ngIf=\"!errorMessage && payments\">\n\n <table class=\"table\">\n <tr>\n <th class=\"bold font-xsmall\">Payment group reference</th>\n <th class=\"bold font-xsmall\">Payment reference</th>\n <th class=\"bold font-xsmall\">Date created</th>\n <th class=\"bold font-xsmall\">Channel</th>\n <th class=\"bold font-xsmall\">Method</th>\n <th class=\"bold font-xsmall\">Amount</th>\n <th class=\"bold font-xsmall\">Status</th>\n </tr>\n <tr *ngFor=\"let payment of payments.payments\">\n <td class=\"font-xsmall\">\n <a href=\"javascript:void(0)\" (click)=\"loadPaymentViewComponent(payment.payment_group_reference, payment.payment_reference, payment.method)\">{{ payment.payment_group_reference }}</a>\n <td class=\"font-xsmall\">{{ payment.payment_reference }}</td>\n <td class=\"font-xsmall\">{{ payment.date_created | date:'dd MMM yyyy' }}</td>\n <td class=\"font-xsmall\">{{ payment.channel | titlecase }}</td>\n <td class=\"font-xsmall\">{{ payment.method | titlecase }}</td>\n <td class=\"font-xsmall\">\u00A3{{ payment.amount | number:'.2' }}</td>\n <td *ngIf=\"payment.method === 'card' && payment.channel === 'online'\">\n <details>\n <summary><span class=\"summary font-xsmall\">{{ payment.status }}</span></summary>\n <div class=\"panel panel-border-narrow\" *ngIf=\"payment.status === 'Failed'\">\n <div *ngFor=\"let statusHistory of payment.status_histories\">\n <p class=\"font-xsmall\" *ngIf=\"statusHistory.error_code === 'P0010'\">\n Payment rejected due to payment method selected or payment information entered, for example, failed fraud check, a 3D Secure authentication failure, or the user does not have enough money in account\n </p>\n <p class=\"font-xsmall\" *ngIf=\"statusHistory.error_code === 'P0020'\">\n Payment was not confirmed and completed within 90 minutes of being created\n </p>\n <p class=\"font-xsmall\" *ngIf=\"statusHistory.error_code === 'P0030'\">\n User clicked on the \u201CCancel payment\u201D button during the payment journey\n </p>\n <p class=\"font-xsmall\" *ngIf=\"statusHistory.error_code === 'P0050'\">\n Multiple possible causes, for example a configuration problem with the payment provider, or incorrect login credentials\n </p>\n </div>\n </div>\n </details>\n </td>\n <td *ngIf=\"payment.method === 'card' && payment.channel === 'telephony'\" class=\"font-xsmall\">\n {{ payment.status}}\n </td>\n <td *ngIf=\"payment.method === 'payment by account'\">\n <details>\n <summary><span class=\"summary font-xsmall\">{{ payment.status }}</span></summary>\n <div class=\"panel panel-border-narrow\" *ngIf=\"payment.status === 'Pending'\">\n <p class=\"font-xsmall\">This means the transaction is being processed by Liberata.</p>\n </div>\n </details>\n </td>\n </tr>\n </table>\n\n </div>\n\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i3.DecimalPipe, name: "number" }, { kind: "pipe", type: i3.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i3.DatePipe, name: "date" }] });
5428
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: PaymentListComponent, deps: [{ token: PaymentListService }, { token: 'PAYMENT_LIB' }], target: i0.ɵɵFactoryTarget.Component });
5429
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: PaymentListComponent, isStandalone: false, selector: "ccpay-payment-list", ngImport: i0, template: "<div class=\"govuk-width-container\">\n\n <div *ngIf=\"errorMessage\">\n <div class=\"error-summary\" role=\"group\" aria-labelledby=\"failure-error-summary-heading\" tabindex=\"-1\">\n <h2 class=\"heading-medium error-summary-heading\" id=\"failure-error-summary-heading\">\n Payments list could not be retrieved\n </h2>\n <div class=\"govuk-error-summary__body\">\n {{ errorMessage }}\n </div>\n </div>\n </div>\n\n <div *ngIf=\"!errorMessage && payments\">\n\n <table class=\"table\">\n <tr>\n <th class=\"bold font-xsmall\">Payment group reference</th>\n <th class=\"bold font-xsmall\">Payment reference</th>\n <th class=\"bold font-xsmall\">Date created</th>\n <th class=\"bold font-xsmall\">Channel</th>\n <th class=\"bold font-xsmall\">Method</th>\n <th class=\"bold font-xsmall\">Amount</th>\n <th class=\"bold font-xsmall\">Status</th>\n </tr>\n <tr *ngFor=\"let payment of payments.payments\">\n <td class=\"font-xsmall\">\n <a href=\"javascript:void(0)\" (click)=\"loadPaymentViewComponent(payment.payment_group_reference, payment.payment_reference, payment.method)\">{{ payment.payment_group_reference }}</a>\n <td class=\"font-xsmall\">{{ payment.payment_reference }}</td>\n <td class=\"font-xsmall\">{{ payment.date_created | date:'dd MMM yyyy' }}</td>\n <td class=\"font-xsmall\">{{ payment.channel | titlecase }}</td>\n <td class=\"font-xsmall\">{{ payment.method | titlecase }}</td>\n <td class=\"font-xsmall\">\u00A3{{ payment.amount | number:'.2' }}</td>\n <td *ngIf=\"payment.method === 'card' && payment.channel === 'online'\">\n <details>\n <summary><span class=\"summary font-xsmall\">{{ payment.status }}</span></summary>\n <div class=\"panel panel-border-narrow\" *ngIf=\"payment.status === 'Failed'\">\n <div *ngFor=\"let statusHistory of payment.status_histories\">\n <p class=\"font-xsmall\" *ngIf=\"statusHistory.error_code === 'P0010'\">\n Payment rejected due to payment method selected or payment information entered, for example, failed fraud check, a 3D Secure authentication failure, or the user does not have enough money in account\n </p>\n <p class=\"font-xsmall\" *ngIf=\"statusHistory.error_code === 'P0020'\">\n Payment was not confirmed and completed within 90 minutes of being created\n </p>\n <p class=\"font-xsmall\" *ngIf=\"statusHistory.error_code === 'P0030'\">\n User clicked on the \u201CCancel payment\u201D button during the payment journey\n </p>\n <p class=\"font-xsmall\" *ngIf=\"statusHistory.error_code === 'P0050'\">\n Multiple possible causes, for example a configuration problem with the payment provider, or incorrect login credentials\n </p>\n </div>\n </div>\n </details>\n </td>\n <td *ngIf=\"payment.method === 'card' && payment.channel === 'telephony'\" class=\"font-xsmall\">\n {{ payment.status}}\n </td>\n <td *ngIf=\"payment.method === 'payment by account'\">\n <details>\n <summary><span class=\"summary font-xsmall\">{{ payment.status }}</span></summary>\n <div class=\"panel panel-border-narrow\" *ngIf=\"payment.status === 'Pending'\">\n <p class=\"font-xsmall\">This means the transaction is being processed by Liberata.</p>\n </div>\n </details>\n </td>\n </tr>\n </table>\n\n </div>\n\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i3.DecimalPipe, name: "number" }, { kind: "pipe", type: i3.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i3.DatePipe, name: "date" }] });
5416
5430
  }
5417
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: PaymentListComponent, decorators: [{
5431
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: PaymentListComponent, decorators: [{
5418
5432
  type: Component,
5419
5433
  args: [{ selector: 'ccpay-payment-list', standalone: false, template: "<div class=\"govuk-width-container\">\n\n <div *ngIf=\"errorMessage\">\n <div class=\"error-summary\" role=\"group\" aria-labelledby=\"failure-error-summary-heading\" tabindex=\"-1\">\n <h2 class=\"heading-medium error-summary-heading\" id=\"failure-error-summary-heading\">\n Payments list could not be retrieved\n </h2>\n <div class=\"govuk-error-summary__body\">\n {{ errorMessage }}\n </div>\n </div>\n </div>\n\n <div *ngIf=\"!errorMessage && payments\">\n\n <table class=\"table\">\n <tr>\n <th class=\"bold font-xsmall\">Payment group reference</th>\n <th class=\"bold font-xsmall\">Payment reference</th>\n <th class=\"bold font-xsmall\">Date created</th>\n <th class=\"bold font-xsmall\">Channel</th>\n <th class=\"bold font-xsmall\">Method</th>\n <th class=\"bold font-xsmall\">Amount</th>\n <th class=\"bold font-xsmall\">Status</th>\n </tr>\n <tr *ngFor=\"let payment of payments.payments\">\n <td class=\"font-xsmall\">\n <a href=\"javascript:void(0)\" (click)=\"loadPaymentViewComponent(payment.payment_group_reference, payment.payment_reference, payment.method)\">{{ payment.payment_group_reference }}</a>\n <td class=\"font-xsmall\">{{ payment.payment_reference }}</td>\n <td class=\"font-xsmall\">{{ payment.date_created | date:'dd MMM yyyy' }}</td>\n <td class=\"font-xsmall\">{{ payment.channel | titlecase }}</td>\n <td class=\"font-xsmall\">{{ payment.method | titlecase }}</td>\n <td class=\"font-xsmall\">\u00A3{{ payment.amount | number:'.2' }}</td>\n <td *ngIf=\"payment.method === 'card' && payment.channel === 'online'\">\n <details>\n <summary><span class=\"summary font-xsmall\">{{ payment.status }}</span></summary>\n <div class=\"panel panel-border-narrow\" *ngIf=\"payment.status === 'Failed'\">\n <div *ngFor=\"let statusHistory of payment.status_histories\">\n <p class=\"font-xsmall\" *ngIf=\"statusHistory.error_code === 'P0010'\">\n Payment rejected due to payment method selected or payment information entered, for example, failed fraud check, a 3D Secure authentication failure, or the user does not have enough money in account\n </p>\n <p class=\"font-xsmall\" *ngIf=\"statusHistory.error_code === 'P0020'\">\n Payment was not confirmed and completed within 90 minutes of being created\n </p>\n <p class=\"font-xsmall\" *ngIf=\"statusHistory.error_code === 'P0030'\">\n User clicked on the \u201CCancel payment\u201D button during the payment journey\n </p>\n <p class=\"font-xsmall\" *ngIf=\"statusHistory.error_code === 'P0050'\">\n Multiple possible causes, for example a configuration problem with the payment provider, or incorrect login credentials\n </p>\n </div>\n </div>\n </details>\n </td>\n <td *ngIf=\"payment.method === 'card' && payment.channel === 'telephony'\" class=\"font-xsmall\">\n {{ payment.status}}\n </td>\n <td *ngIf=\"payment.method === 'payment by account'\">\n <details>\n <summary><span class=\"summary font-xsmall\">{{ payment.status }}</span></summary>\n <div class=\"panel panel-border-narrow\" *ngIf=\"payment.status === 'Pending'\">\n <p class=\"font-xsmall\">This means the transaction is being processed by Liberata.</p>\n </div>\n </details>\n </td>\n </tr>\n </table>\n\n </div>\n\n</div>\n" }]
5420
5434
  }], ctorParameters: () => [{ type: PaymentListService }, { type: undefined, decorators: [{
@@ -5808,10 +5822,10 @@ class ProcessRefundComponent {
5808
5822
  hideNotificationPreview() {
5809
5823
  this.notificationPreview = false;
5810
5824
  }
5811
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: ProcessRefundComponent, deps: [{ token: RefundsService }, { token: PaymentViewService }, { token: i1$1.FormBuilder }, { token: OrderslistService }, { token: NotificationService }, { token: 'PAYMENT_LIB' }, { token: i1$2.Router }, { token: i1$2.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component });
5812
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.1", type: ProcessRefundComponent, isStandalone: false, selector: "ccpay-process-refund", inputs: { refundReference: "refundReference", refundlistsource: "refundlistsource" }, ngImport: i0, template: "<ng-container *ngIf=\"viewStatus === 'RefundProcess'\">\n<div class=\"govuk-width-container\">\n\n <main class=\"govuk-main-wrapper govuk-!-padding-top-0\" [ngClass]=\"{'govuk-radios__conditional--hidden': isSuccesspageEnable}\" id=\"main-content\" role=\"main\">\n <div *ngIf=\"errorMessage.showError\">\n <div class=\"error-summary\" role=\"group\" aria-labelledby=\"failure-error-summary-heading\" tabindex=\"-1\">\n <h2 class=\"heading-medium error-summary-heading\" id=\"failure-error-summary-heading\">\n {{errorMessage.title}}\n </h2>\n <div class=\"govuk-error-summary__body process-refund-font\">\n {{errorMessage.body}}\n </div>\n </div>\n </div>\n\n <div class=\"payment-view-alignment\">\n\n <div class=\"govuk-grid-row\">\n <div class=\"column\">\n <h1 class=\"heading-large govuk-!-margin-top-0\">Review refund details</h1>\n </div>\n </div>\n <table>\n <tbody>\n\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">Payment to be refunded</td>\n <td colspan=\"2\">{{refundlistsource?.refund_reference}} ({{refundlistsource.amount | currency :'GBP':'symbol':'1.2-2' }})</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">Reason for refund</td>\n <td colspan=\"2\">{{refundlistsource?.reason?.trim()}}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">Amount to be refunded</td>\n <td colspan=\"2\">{{refundlistsource?.amount | currency :'GBP':'symbol':'1.2-2' }}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">Sent to</td>\n <td colspan=\"2\">{{cpoDetails?.responsibleParty}}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">Sent via</td>\n <td colspan=\"2\">\n <div *ngIf=\"refundlistsource?.contact_details?.notification_type === 'EMAIL'\" class=\"contactDetails-width font-size-19px\">\n <strong>Email</strong>\n <br/>\n {{refundlistsource?.contact_details?.email?.trim()}}\n </div>\n <div *ngIf=\"refundlistsource?.contact_details?.notification_type === 'LETTER'\" class=\"contactDetails-width font-size-19px\">\n <strong>Post</strong>\n <br/>\n {{refundlistsource?.contact_details?.address_line?.trim()}} {{refundlistsource?.contact_details?.city?.trim()}} {{refundlistsource?.contact_details?.county?.trim()}} {{refundlistsource?.contact_details?.country?.trim()}} {{refundlistsource?.contact_details?.postal_code?.trim()}}\n </div> \n </td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">Submitted by</td>\n <td colspan=\"2\">{{refundlistsource?.user_full_name}}</td>\n\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">Date submitted</td>\n <td colspan=\"2\">{{refundlistsource?.date_created | date:'d MMMM yyyy' }}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">Notification</td>\n <td>{{templateInstructionType}}</td>\n <td>\n <a *ngIf=\"!notificationPreview\" href=\"Javascript:void(0)\" class=\"govuk-link pointer right\" (click)=\"showNotificationPreview()\">\n Preview\n </a>\n <a *ngIf=\"notificationPreview\" href=\"Javascript:void(0)\" class=\"govuk-link pointer right\" (click)=\"hideNotificationPreview()\">\n Hide Preview\n </a>\n </td>\n\n </tr>\n\n </tbody>\n </table>\n\n <app-notification-preview *ngIf=\"notificationPreview\" [paymentReference]=\"refundlistsource?.payment_reference\"\n [payment]=\"paymentObj\"\n [contactDetails]=\"refundlistsource?.contact_details\"\n [refundReason]=\"refundlistsource?.reason_code\" [refundAmount]=\"refundlistsource?.amount\"\n [refundReference]=\"refundlistsource?.refund_reference\"\n (notificationPreviewEvent) = \"getNotificationPreviewObj($event)\">\n </app-notification-preview>\n\n <div>\n </div>\n </div>\n <div class=\"process-refund__panel\">\n <form [formGroup]=\"processRefundForm\" novalidate>\n <div class=\"\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"sign-in-hint\">\n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--l\">\n <h1 class=\"heading-large\">\n What do you want to do with this refund?\n </h1>\n </legend>\n <div class=\"govuk-radios\" [ngClass]=\"{'form-group-error': refundActionsHasError}\">\n <p class=\"inline-error-message\"\n *ngIf=\"refundActionsHasError\">\n <span *ngIf=\"refundActionsHasError\">Please select an action</span>\n </p>\n <div class=\"govuk-radios__item\" *ngFor=\"let refundAction of refundActionList; let i = index;\">\n <input class=\"govuk-radios__input\" \n id=\"refundAction-{{i}}\" \n name=\"refundActionField\"\n type=\"radio\"\n formControlName=\"refundActionField\"\n (click)=\"checkRefundActions(refundAction.code)\"\n value=\"{{refundAction.code}}\">\n <label class=\"govuk-label govuk-radios__label process-refund-font\" for=\"refundAction-{{i}}\">\n {{refundAction.code}}\n </label>\n <div id=\"sign-in-item-hint\" class=\"govuk-hint govuk-radios__hint process-refund-font\">\n {{refundAction.label}}\n </div>\n </div>\n <div class=\"govuk-radios__conditional\" [ngClass]=\"{'govuk-radios__conditional--hidden': !isSendMeBackClicked}\">\n <div class=\"govuk-form-group\">\n <label class=\"govuk-label process-refund-font\" for=\"contact-by-text\">\n Add a reason\n </label>\n <p class=\"inline-error-message\"\n *ngIf=\"isReasonFieldEmpty || isReasonFieldInvalid || reasonFieldMinHasError || reasonFieldMaxHasError\">\n <span *ngIf=\"isReasonFieldEmpty\">Add a reason</span>\n <span *ngIf=\"isReasonFieldInvalid\">Add a valid reason</span>\n <span *ngIf=\"reasonFieldMinHasError\">Reason should be at least 3 characters.</span>\n <span *ngIf=\"reasonFieldMaxHasError\">Reason should be 255 characters or under.</span>\n </p>\n <textarea class=\"govuk-textarea govuk-!-width-one-third reason-font\"\n [ngClass]=\"{'inline-error-class': isReasonFieldEmpty || isReasonFieldInvalid || reasonFieldMinHasError || reasonFieldMaxHasError}\"\n id=\"sendmeback\"\n name=\"sendMeBackField\" \n formControlName=\"sendMeBackField\"\n rows=\"5\"></textarea>\n \n </div>\n\n </div>\n \n </div>\n \n </fieldset>\n </div>\n\n <div [ngClass]=\"{'govuk-radios__conditional--hidden': !isRejectClicked}\">\n <fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--l\">\n <h2 class=\"heading-medium\">\n Why are you rejecting this refund?\n </h2>\n </legend>\n <div class=\"govuk-radios\" [ngClass]=\"{'form-group-error': refundRejectReasonHasError}\">\n <p class=\"inline-error-message\"\n *ngIf=\"refundRejectReasonHasError\">\n <span *ngIf=\"refundRejectReasonHasError\">Please select a reject reason</span>\n </p>\n <div class=\"govuk-radios__item\" *ngFor=\"let refundRejectReason of refundRejectReasonList; let j = index;\">\n <input class=\"govuk-radios__input\" \n id=\"refundRejectReason-{{j}}\"\n formControlName=\"refundRejectReasonField\"\n name=\"refundRejectReasonField\"\n (click)=\"checkRefundActions(refundRejectReason.code)\"\n type=\"radio\" value=\"{{refundRejectReason.code}}\">\n <label class=\"govuk-label govuk-radios__label process-refund-font\" for=\"refundRejectReason-{{j}}\">\n {{refundRejectReason.name}}\n </label>\n </div>\n </div>\n <div class=\"govuk-radios__conditional\" [ngClass]=\"{'govuk-radios__conditional--hidden': !isOtherClicked}\" id=\"conditional-contact-3\">\n <div class=\"govuk-form-group\">\n <label class=\"govuk-label process-refund-font \" for=\"contact-by-text\">\n Enter reason\n </label>\n <p class=\"inline-error-message\" *ngIf=\"isReasonEmpty || isReasonInvalid\">\n <span *ngIf=\"isReasonEmpty\">Enter reason.</span>\n <span *ngIf=\"isReasonInvalid\">Enter a valid reason</span>\n </p>\n <input class=\"govuk-input govuk-!-width-one-third reason-font\" id=\"otherReason\" \n [ngClass]=\"{'inline-error-class': isReasonEmpty || isReasonInvalid}\"\n formControlName=\"enterReasonField\" name=\"enterReasonField\" type=\"text\"></div>\n \n </div>\n \n </fieldset>\n </div>\n\n <div class=\"govuk-button-group\">\n <button (click)=\"redirecttoRefundListPage()\" class=\"govuk-button govuk-button--secondary marginright\"> Previous</button>\n <button (click)=\"processRefundSubmit()\" class=\"govuk-button button\"\n data-module=\"govuk-button\">\n Submit \n </button>\n <br/><br/>\n </div>\n \n <div *ngIf=\"!isFromRefundListPage\" class=\"govuk-button-group margin\">\n\n <p><a (click)=\"loadRefundsHomePage()\" class=\"govuk-link pointer\" data-module=\"govuk-button\">Cancel</a></p>\n</div>\n</form>\n </div>\n \n\n </main>\n \n <main class=\"govuk-main-wrapper govuk-main-wrapper--l success-page-padding--top25\" [ngClass]=\"{'govuk-radios__conditional--hidden': !isSuccesspageEnable}\" id=\"main-content\" role=\"main\" >\n <div class=\"govuk-grid-row pagesize\">\n <div class=\"govuk-panel govuk-panel-refund--confirmation\">\n <h1 class=\"heading-refunds-xlarge\">\n {{successMsg}}\n </h1>\n </div>\n <p class=\"govuk-body process-refund-font\">\n <a href=\"Javascript:void(0)\" (click)=\"goToCaseReview()\" class=\"govuk-link pointer\">Return to case</a>\n </p>\n </div>\n </main>\n</div>\n</ng-container>\n\n", styles: [".tb-col-w{width:330px}.tr-border{border-bottom:2px solid}.payment-view-alignment{margin-left:30px}.govuk-button{float:left!important;font-size:19px;margin-top:2em!important}.remission{margin-bottom:7em}.process-refund-font{font-size:19px!important}.govuk-radios__conditional--hidden{display:none}.inline-error-message{color:#c11717;font-weight:700;margin-top:10px;border-color:#c11717}.inline-error-class{outline:3px solid #c11717;outline-offset:0;border-color:#c11717}.form-group-error{border-left:5px solid #c11717;padding-left:15px}.govuk-panel-refund--confirmation{color:#fff;background:#00703c}.process-refund__panel{margin-left:25px;margin-top:30px}.button-margin--left25{margin-left:25px}.success-page-padding--top25{padding-top:25px}.margin{margin-top:5em}.marginright{margin-right:1.5em}.govuk-textarea{line-height:2.25}.reason-font{font-size:19px!important}.pointer{cursor:pointer}.right{float:right}.pagesize{margin:2em;width:97%}.heading-refunds-xlarge{color:#fff;font-family:nta,Arial,sans-serif;font-weight:700;text-transform:none;font-size:32px;line-height:1.09375;margin-top:.46875em;margin-bottom:.9375em}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: NotificationPreviewComponent, selector: "app-notification-preview", inputs: ["payment", "contactDetails", "refundReason", "refundAmount", "paymentReference", "refundReference", "previewJourney", "notificationSent"], outputs: ["notificationPreviewEvent"] }, { kind: "pipe", type: i3.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i3.DatePipe, name: "date" }] });
5825
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: ProcessRefundComponent, deps: [{ token: RefundsService }, { token: PaymentViewService }, { token: i1$1.FormBuilder }, { token: OrderslistService }, { token: NotificationService }, { token: 'PAYMENT_LIB' }, { token: i1$2.Router }, { token: i1$2.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component });
5826
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: ProcessRefundComponent, isStandalone: false, selector: "ccpay-process-refund", inputs: { refundReference: "refundReference", refundlistsource: "refundlistsource" }, ngImport: i0, template: "<ng-container *ngIf=\"viewStatus === 'RefundProcess'\">\n<div class=\"govuk-width-container\">\n\n <main class=\"govuk-main-wrapper govuk-!-padding-top-0\" [ngClass]=\"{'govuk-radios__conditional--hidden': isSuccesspageEnable}\" id=\"main-content\" role=\"main\">\n <div *ngIf=\"errorMessage.showError\">\n <div class=\"error-summary\" role=\"group\" aria-labelledby=\"failure-error-summary-heading\" tabindex=\"-1\">\n <h2 class=\"heading-medium error-summary-heading\" id=\"failure-error-summary-heading\">\n {{errorMessage.title}}\n </h2>\n <div class=\"govuk-error-summary__body process-refund-font\">\n {{errorMessage.body}}\n </div>\n </div>\n </div>\n\n <div class=\"payment-view-alignment\">\n\n <div class=\"govuk-grid-row\">\n <div class=\"column\">\n <h1 class=\"heading-large govuk-!-margin-top-0\">Review refund details</h1>\n </div>\n </div>\n <table>\n <tbody>\n\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">Payment to be refunded</td>\n <td colspan=\"2\">{{refundlistsource?.refund_reference}} ({{refundlistsource.amount | currency :'GBP':'symbol':'1.2-2' }})</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">Reason for refund</td>\n <td colspan=\"2\">{{refundlistsource?.reason?.trim()}}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">Amount to be refunded</td>\n <td colspan=\"2\">{{refundlistsource?.amount | currency :'GBP':'symbol':'1.2-2' }}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">Sent to</td>\n <td colspan=\"2\">{{cpoDetails?.responsibleParty}}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">Sent via</td>\n <td colspan=\"2\">\n <div *ngIf=\"refundlistsource?.contact_details?.notification_type === 'EMAIL'\" class=\"contactDetails-width font-size-19px\">\n <strong>Email</strong>\n <br/>\n {{refundlistsource?.contact_details?.email?.trim()}}\n </div>\n <div *ngIf=\"refundlistsource?.contact_details?.notification_type === 'LETTER'\" class=\"contactDetails-width font-size-19px\">\n <strong>Post</strong>\n <br/>\n {{refundlistsource?.contact_details?.address_line?.trim()}} {{refundlistsource?.contact_details?.city?.trim()}} {{refundlistsource?.contact_details?.county?.trim()}} {{refundlistsource?.contact_details?.country?.trim()}} {{refundlistsource?.contact_details?.postal_code?.trim()}}\n </div> \n </td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">Submitted by</td>\n <td colspan=\"2\">{{refundlistsource?.user_full_name}}</td>\n\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">Date submitted</td>\n <td colspan=\"2\">{{refundlistsource?.date_created | date:'d MMMM yyyy' }}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">Notification</td>\n <td>{{templateInstructionType}}</td>\n <td>\n <a *ngIf=\"!notificationPreview\" href=\"Javascript:void(0)\" class=\"govuk-link pointer right\" (click)=\"showNotificationPreview()\">\n Preview\n </a>\n <a *ngIf=\"notificationPreview\" href=\"Javascript:void(0)\" class=\"govuk-link pointer right\" (click)=\"hideNotificationPreview()\">\n Hide Preview\n </a>\n </td>\n\n </tr>\n\n </tbody>\n </table>\n\n <app-notification-preview *ngIf=\"notificationPreview\" [paymentReference]=\"refundlistsource?.payment_reference\"\n [payment]=\"paymentObj\"\n [contactDetails]=\"refundlistsource?.contact_details\"\n [refundReason]=\"refundlistsource?.reason_code\" [refundAmount]=\"refundlistsource?.amount\"\n [refundReference]=\"refundlistsource?.refund_reference\"\n (notificationPreviewEvent) = \"getNotificationPreviewObj($event)\">\n </app-notification-preview>\n\n <div>\n </div>\n </div>\n <div class=\"process-refund__panel\">\n <form [formGroup]=\"processRefundForm\" novalidate>\n <div class=\"\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"sign-in-hint\">\n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--l\">\n <h1 class=\"heading-large\">\n What do you want to do with this refund?\n </h1>\n </legend>\n <div class=\"govuk-radios\" [ngClass]=\"{'form-group-error': refundActionsHasError}\">\n <p class=\"inline-error-message\"\n *ngIf=\"refundActionsHasError\">\n <span *ngIf=\"refundActionsHasError\">Please select an action</span>\n </p>\n <div class=\"govuk-radios__item\" *ngFor=\"let refundAction of refundActionList; let i = index;\">\n <input class=\"govuk-radios__input\" \n id=\"refundAction-{{i}}\" \n name=\"refundActionField\"\n type=\"radio\"\n formControlName=\"refundActionField\"\n (click)=\"checkRefundActions(refundAction.code)\"\n value=\"{{refundAction.code}}\">\n <label class=\"govuk-label govuk-radios__label process-refund-font\" for=\"refundAction-{{i}}\">\n {{refundAction.code}}\n </label>\n <div id=\"sign-in-item-hint\" class=\"govuk-hint govuk-radios__hint process-refund-font\">\n {{refundAction.label}}\n </div>\n </div>\n <div class=\"govuk-radios__conditional\" [ngClass]=\"{'govuk-radios__conditional--hidden': !isSendMeBackClicked}\">\n <div class=\"govuk-form-group\">\n <label class=\"govuk-label process-refund-font\" for=\"contact-by-text\">\n Add a reason\n </label>\n <p class=\"inline-error-message\"\n *ngIf=\"isReasonFieldEmpty || isReasonFieldInvalid || reasonFieldMinHasError || reasonFieldMaxHasError\">\n <span *ngIf=\"isReasonFieldEmpty\">Add a reason</span>\n <span *ngIf=\"isReasonFieldInvalid\">Add a valid reason</span>\n <span *ngIf=\"reasonFieldMinHasError\">Reason should be at least 3 characters.</span>\n <span *ngIf=\"reasonFieldMaxHasError\">Reason should be 255 characters or under.</span>\n </p>\n <textarea class=\"govuk-textarea govuk-!-width-one-third reason-font\"\n [ngClass]=\"{'inline-error-class': isReasonFieldEmpty || isReasonFieldInvalid || reasonFieldMinHasError || reasonFieldMaxHasError}\"\n id=\"sendmeback\"\n name=\"sendMeBackField\" \n formControlName=\"sendMeBackField\"\n rows=\"5\"></textarea>\n \n </div>\n\n </div>\n \n </div>\n \n </fieldset>\n </div>\n\n <div [ngClass]=\"{'govuk-radios__conditional--hidden': !isRejectClicked}\">\n <fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--l\">\n <h2 class=\"heading-medium\">\n Why are you rejecting this refund?\n </h2>\n </legend>\n <div class=\"govuk-radios\" [ngClass]=\"{'form-group-error': refundRejectReasonHasError}\">\n <p class=\"inline-error-message\"\n *ngIf=\"refundRejectReasonHasError\">\n <span *ngIf=\"refundRejectReasonHasError\">Please select a reject reason</span>\n </p>\n <div class=\"govuk-radios__item\" *ngFor=\"let refundRejectReason of refundRejectReasonList; let j = index;\">\n <input class=\"govuk-radios__input\" \n id=\"refundRejectReason-{{j}}\"\n formControlName=\"refundRejectReasonField\"\n name=\"refundRejectReasonField\"\n (click)=\"checkRefundActions(refundRejectReason.code)\"\n type=\"radio\" value=\"{{refundRejectReason.code}}\">\n <label class=\"govuk-label govuk-radios__label process-refund-font\" for=\"refundRejectReason-{{j}}\">\n {{refundRejectReason.name}}\n </label>\n </div>\n </div>\n <div class=\"govuk-radios__conditional\" [ngClass]=\"{'govuk-radios__conditional--hidden': !isOtherClicked}\" id=\"conditional-contact-3\">\n <div class=\"govuk-form-group\">\n <label class=\"govuk-label process-refund-font \" for=\"contact-by-text\">\n Enter reason\n </label>\n <p class=\"inline-error-message\" *ngIf=\"isReasonEmpty || isReasonInvalid\">\n <span *ngIf=\"isReasonEmpty\">Enter reason.</span>\n <span *ngIf=\"isReasonInvalid\">Enter a valid reason</span>\n </p>\n <input class=\"govuk-input govuk-!-width-one-third reason-font\" id=\"otherReason\" \n [ngClass]=\"{'inline-error-class': isReasonEmpty || isReasonInvalid}\"\n formControlName=\"enterReasonField\" name=\"enterReasonField\" type=\"text\"></div>\n \n </div>\n \n </fieldset>\n </div>\n\n <div class=\"govuk-button-group\">\n <button (click)=\"redirecttoRefundListPage()\" class=\"govuk-button govuk-button--secondary marginright\"> Previous</button>\n <button (click)=\"processRefundSubmit()\" class=\"govuk-button button\"\n data-module=\"govuk-button\">\n Submit \n </button>\n <br/><br/>\n </div>\n \n <div *ngIf=\"!isFromRefundListPage\" class=\"govuk-button-group margin\">\n\n <p><a (click)=\"loadRefundsHomePage()\" class=\"govuk-link pointer\" data-module=\"govuk-button\">Cancel</a></p>\n</div>\n</form>\n </div>\n \n\n </main>\n \n <main class=\"govuk-main-wrapper govuk-main-wrapper--l success-page-padding--top25\" [ngClass]=\"{'govuk-radios__conditional--hidden': !isSuccesspageEnable}\" id=\"main-content\" role=\"main\" >\n <div class=\"govuk-grid-row pagesize\">\n <div class=\"govuk-panel govuk-panel-refund--confirmation\">\n <h1 class=\"heading-refunds-xlarge\">\n {{successMsg}}\n </h1>\n </div>\n <p class=\"govuk-body process-refund-font\">\n <a href=\"Javascript:void(0)\" (click)=\"goToCaseReview()\" class=\"govuk-link pointer\">Return to case</a>\n </p>\n </div>\n </main>\n</div>\n</ng-container>\n\n", styles: [".tb-col-w{width:330px}.tr-border{border-bottom:2px solid}.payment-view-alignment{margin-left:30px}.govuk-button{float:left!important;font-size:19px;margin-top:2em!important}.remission{margin-bottom:7em}.process-refund-font{font-size:19px!important}.govuk-radios__conditional--hidden{display:none}.inline-error-message{color:#c11717;font-weight:700;margin-top:10px;border-color:#c11717}.inline-error-class{outline:3px solid #c11717;outline-offset:0;border-color:#c11717}.form-group-error{border-left:5px solid #c11717;padding-left:15px}.govuk-panel-refund--confirmation{color:#fff;background:#00703c}.process-refund__panel{margin-left:25px;margin-top:30px}.button-margin--left25{margin-left:25px}.success-page-padding--top25{padding-top:25px}.margin{margin-top:5em}.marginright{margin-right:1.5em}.govuk-textarea{line-height:2.25}.reason-font{font-size:19px!important}.pointer{cursor:pointer}.right{float:right}.pagesize{margin:2em;width:97%}.heading-refunds-xlarge{color:#fff;font-family:nta,Arial,sans-serif;font-weight:700;text-transform:none;font-size:32px;line-height:1.09375;margin-top:.46875em;margin-bottom:.9375em}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: NotificationPreviewComponent, selector: "app-notification-preview", inputs: ["payment", "contactDetails", "refundReason", "refundAmount", "paymentReference", "refundReference", "previewJourney", "notificationSent"], outputs: ["notificationPreviewEvent"] }, { kind: "pipe", type: i3.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i3.DatePipe, name: "date" }] });
5813
5827
  }
5814
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: ProcessRefundComponent, decorators: [{
5828
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: ProcessRefundComponent, decorators: [{
5815
5829
  type: Component,
5816
5830
  args: [{ selector: 'ccpay-process-refund', standalone: false, template: "<ng-container *ngIf=\"viewStatus === 'RefundProcess'\">\n<div class=\"govuk-width-container\">\n\n <main class=\"govuk-main-wrapper govuk-!-padding-top-0\" [ngClass]=\"{'govuk-radios__conditional--hidden': isSuccesspageEnable}\" id=\"main-content\" role=\"main\">\n <div *ngIf=\"errorMessage.showError\">\n <div class=\"error-summary\" role=\"group\" aria-labelledby=\"failure-error-summary-heading\" tabindex=\"-1\">\n <h2 class=\"heading-medium error-summary-heading\" id=\"failure-error-summary-heading\">\n {{errorMessage.title}}\n </h2>\n <div class=\"govuk-error-summary__body process-refund-font\">\n {{errorMessage.body}}\n </div>\n </div>\n </div>\n\n <div class=\"payment-view-alignment\">\n\n <div class=\"govuk-grid-row\">\n <div class=\"column\">\n <h1 class=\"heading-large govuk-!-margin-top-0\">Review refund details</h1>\n </div>\n </div>\n <table>\n <tbody>\n\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">Payment to be refunded</td>\n <td colspan=\"2\">{{refundlistsource?.refund_reference}} ({{refundlistsource.amount | currency :'GBP':'symbol':'1.2-2' }})</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">Reason for refund</td>\n <td colspan=\"2\">{{refundlistsource?.reason?.trim()}}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">Amount to be refunded</td>\n <td colspan=\"2\">{{refundlistsource?.amount | currency :'GBP':'symbol':'1.2-2' }}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">Sent to</td>\n <td colspan=\"2\">{{cpoDetails?.responsibleParty}}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">Sent via</td>\n <td colspan=\"2\">\n <div *ngIf=\"refundlistsource?.contact_details?.notification_type === 'EMAIL'\" class=\"contactDetails-width font-size-19px\">\n <strong>Email</strong>\n <br/>\n {{refundlistsource?.contact_details?.email?.trim()}}\n </div>\n <div *ngIf=\"refundlistsource?.contact_details?.notification_type === 'LETTER'\" class=\"contactDetails-width font-size-19px\">\n <strong>Post</strong>\n <br/>\n {{refundlistsource?.contact_details?.address_line?.trim()}} {{refundlistsource?.contact_details?.city?.trim()}} {{refundlistsource?.contact_details?.county?.trim()}} {{refundlistsource?.contact_details?.country?.trim()}} {{refundlistsource?.contact_details?.postal_code?.trim()}}\n </div> \n </td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">Submitted by</td>\n <td colspan=\"2\">{{refundlistsource?.user_full_name}}</td>\n\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">Date submitted</td>\n <td colspan=\"2\">{{refundlistsource?.date_created | date:'d MMMM yyyy' }}</td>\n </tr>\n <tr class=\"section\">\n <td class=\"bold tb-col-w\">Notification</td>\n <td>{{templateInstructionType}}</td>\n <td>\n <a *ngIf=\"!notificationPreview\" href=\"Javascript:void(0)\" class=\"govuk-link pointer right\" (click)=\"showNotificationPreview()\">\n Preview\n </a>\n <a *ngIf=\"notificationPreview\" href=\"Javascript:void(0)\" class=\"govuk-link pointer right\" (click)=\"hideNotificationPreview()\">\n Hide Preview\n </a>\n </td>\n\n </tr>\n\n </tbody>\n </table>\n\n <app-notification-preview *ngIf=\"notificationPreview\" [paymentReference]=\"refundlistsource?.payment_reference\"\n [payment]=\"paymentObj\"\n [contactDetails]=\"refundlistsource?.contact_details\"\n [refundReason]=\"refundlistsource?.reason_code\" [refundAmount]=\"refundlistsource?.amount\"\n [refundReference]=\"refundlistsource?.refund_reference\"\n (notificationPreviewEvent) = \"getNotificationPreviewObj($event)\">\n </app-notification-preview>\n\n <div>\n </div>\n </div>\n <div class=\"process-refund__panel\">\n <form [formGroup]=\"processRefundForm\" novalidate>\n <div class=\"\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"sign-in-hint\">\n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--l\">\n <h1 class=\"heading-large\">\n What do you want to do with this refund?\n </h1>\n </legend>\n <div class=\"govuk-radios\" [ngClass]=\"{'form-group-error': refundActionsHasError}\">\n <p class=\"inline-error-message\"\n *ngIf=\"refundActionsHasError\">\n <span *ngIf=\"refundActionsHasError\">Please select an action</span>\n </p>\n <div class=\"govuk-radios__item\" *ngFor=\"let refundAction of refundActionList; let i = index;\">\n <input class=\"govuk-radios__input\" \n id=\"refundAction-{{i}}\" \n name=\"refundActionField\"\n type=\"radio\"\n formControlName=\"refundActionField\"\n (click)=\"checkRefundActions(refundAction.code)\"\n value=\"{{refundAction.code}}\">\n <label class=\"govuk-label govuk-radios__label process-refund-font\" for=\"refundAction-{{i}}\">\n {{refundAction.code}}\n </label>\n <div id=\"sign-in-item-hint\" class=\"govuk-hint govuk-radios__hint process-refund-font\">\n {{refundAction.label}}\n </div>\n </div>\n <div class=\"govuk-radios__conditional\" [ngClass]=\"{'govuk-radios__conditional--hidden': !isSendMeBackClicked}\">\n <div class=\"govuk-form-group\">\n <label class=\"govuk-label process-refund-font\" for=\"contact-by-text\">\n Add a reason\n </label>\n <p class=\"inline-error-message\"\n *ngIf=\"isReasonFieldEmpty || isReasonFieldInvalid || reasonFieldMinHasError || reasonFieldMaxHasError\">\n <span *ngIf=\"isReasonFieldEmpty\">Add a reason</span>\n <span *ngIf=\"isReasonFieldInvalid\">Add a valid reason</span>\n <span *ngIf=\"reasonFieldMinHasError\">Reason should be at least 3 characters.</span>\n <span *ngIf=\"reasonFieldMaxHasError\">Reason should be 255 characters or under.</span>\n </p>\n <textarea class=\"govuk-textarea govuk-!-width-one-third reason-font\"\n [ngClass]=\"{'inline-error-class': isReasonFieldEmpty || isReasonFieldInvalid || reasonFieldMinHasError || reasonFieldMaxHasError}\"\n id=\"sendmeback\"\n name=\"sendMeBackField\" \n formControlName=\"sendMeBackField\"\n rows=\"5\"></textarea>\n \n </div>\n\n </div>\n \n </div>\n \n </fieldset>\n </div>\n\n <div [ngClass]=\"{'govuk-radios__conditional--hidden': !isRejectClicked}\">\n <fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--l\">\n <h2 class=\"heading-medium\">\n Why are you rejecting this refund?\n </h2>\n </legend>\n <div class=\"govuk-radios\" [ngClass]=\"{'form-group-error': refundRejectReasonHasError}\">\n <p class=\"inline-error-message\"\n *ngIf=\"refundRejectReasonHasError\">\n <span *ngIf=\"refundRejectReasonHasError\">Please select a reject reason</span>\n </p>\n <div class=\"govuk-radios__item\" *ngFor=\"let refundRejectReason of refundRejectReasonList; let j = index;\">\n <input class=\"govuk-radios__input\" \n id=\"refundRejectReason-{{j}}\"\n formControlName=\"refundRejectReasonField\"\n name=\"refundRejectReasonField\"\n (click)=\"checkRefundActions(refundRejectReason.code)\"\n type=\"radio\" value=\"{{refundRejectReason.code}}\">\n <label class=\"govuk-label govuk-radios__label process-refund-font\" for=\"refundRejectReason-{{j}}\">\n {{refundRejectReason.name}}\n </label>\n </div>\n </div>\n <div class=\"govuk-radios__conditional\" [ngClass]=\"{'govuk-radios__conditional--hidden': !isOtherClicked}\" id=\"conditional-contact-3\">\n <div class=\"govuk-form-group\">\n <label class=\"govuk-label process-refund-font \" for=\"contact-by-text\">\n Enter reason\n </label>\n <p class=\"inline-error-message\" *ngIf=\"isReasonEmpty || isReasonInvalid\">\n <span *ngIf=\"isReasonEmpty\">Enter reason.</span>\n <span *ngIf=\"isReasonInvalid\">Enter a valid reason</span>\n </p>\n <input class=\"govuk-input govuk-!-width-one-third reason-font\" id=\"otherReason\" \n [ngClass]=\"{'inline-error-class': isReasonEmpty || isReasonInvalid}\"\n formControlName=\"enterReasonField\" name=\"enterReasonField\" type=\"text\"></div>\n \n </div>\n \n </fieldset>\n </div>\n\n <div class=\"govuk-button-group\">\n <button (click)=\"redirecttoRefundListPage()\" class=\"govuk-button govuk-button--secondary marginright\"> Previous</button>\n <button (click)=\"processRefundSubmit()\" class=\"govuk-button button\"\n data-module=\"govuk-button\">\n Submit \n </button>\n <br/><br/>\n </div>\n \n <div *ngIf=\"!isFromRefundListPage\" class=\"govuk-button-group margin\">\n\n <p><a (click)=\"loadRefundsHomePage()\" class=\"govuk-link pointer\" data-module=\"govuk-button\">Cancel</a></p>\n</div>\n</form>\n </div>\n \n\n </main>\n \n <main class=\"govuk-main-wrapper govuk-main-wrapper--l success-page-padding--top25\" [ngClass]=\"{'govuk-radios__conditional--hidden': !isSuccesspageEnable}\" id=\"main-content\" role=\"main\" >\n <div class=\"govuk-grid-row pagesize\">\n <div class=\"govuk-panel govuk-panel-refund--confirmation\">\n <h1 class=\"heading-refunds-xlarge\">\n {{successMsg}}\n </h1>\n </div>\n <p class=\"govuk-body process-refund-font\">\n <a href=\"Javascript:void(0)\" (click)=\"goToCaseReview()\" class=\"govuk-link pointer\">Return to case</a>\n </p>\n </div>\n </main>\n</div>\n</ng-container>\n\n", styles: [".tb-col-w{width:330px}.tr-border{border-bottom:2px solid}.payment-view-alignment{margin-left:30px}.govuk-button{float:left!important;font-size:19px;margin-top:2em!important}.remission{margin-bottom:7em}.process-refund-font{font-size:19px!important}.govuk-radios__conditional--hidden{display:none}.inline-error-message{color:#c11717;font-weight:700;margin-top:10px;border-color:#c11717}.inline-error-class{outline:3px solid #c11717;outline-offset:0;border-color:#c11717}.form-group-error{border-left:5px solid #c11717;padding-left:15px}.govuk-panel-refund--confirmation{color:#fff;background:#00703c}.process-refund__panel{margin-left:25px;margin-top:30px}.button-margin--left25{margin-left:25px}.success-page-padding--top25{padding-top:25px}.margin{margin-top:5em}.marginright{margin-right:1.5em}.govuk-textarea{line-height:2.25}.reason-font{font-size:19px!important}.pointer{cursor:pointer}.right{float:right}.pagesize{margin:2em;width:97%}.heading-refunds-xlarge{color:#fff;font-family:nta,Arial,sans-serif;font-weight:700;text-transform:none;font-size:32px;line-height:1.09375;margin-top:.46875em;margin-bottom:.9375em}\n"] }]
5817
5831
  }], ctorParameters: () => [{ type: RefundsService }, { type: PaymentViewService }, { type: i1$1.FormBuilder }, { type: OrderslistService }, { type: NotificationService }, { type: undefined, decorators: [{
@@ -5909,10 +5923,10 @@ class TableComponent {
5909
5923
  goToCaseReview(ccdCaseNumber, refundData) {
5910
5924
  this.router.navigate([`/cases/case-details/${ccdCaseNumber}`], { relativeTo: this.activeRoute });
5911
5925
  }
5912
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: TableComponent, deps: [{ token: 'PAYMENT_LIB' }, { token: i0.ChangeDetectorRef }, { token: OrderslistService }, { token: i1$2.Router }, { token: i1$2.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component });
5913
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.1", type: TableComponent, isStandalone: false, selector: "ccpay-table", inputs: { DATASOURCE: "DATASOURCE", STATUS: "STATUS", errorMessage: "errorMessage" }, viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true }], ngImport: i0, template: "<div class=\"add-remission\">\n <div *ngIf=\"errorMessage\">\n <div class=\"error-summary\" role=\"group\" aria-labelledby=\"failure-error-summary-heading\" tabindex=\"-1\">\n <h2 class=\"heading-medium error-summary-heading\" id=\"failure-error-summary-heading\">\n Error in processing the request\n </h2>\n <div class=\"govuk-error-summary__body\">\n {{ errorMessage }}\n </div>\n </div>\n </div>\n\n\n <div *ngIf=\"dataSource.data.length > 0\" class=\"govuk-form-group float-right\">\n <label class=\"govuk-label dropdpwn\" for=\"sort\">\n Filter by caseworker:\n </label>\n <select class=\"govuk-select\" id=\"sort\" name=\"sort\" (change)=\"selectchange($event)\">\n <option value=\"\" selected='selected'>All caseworkers</option>\n <option *ngFor=\"let name of userLst;\" value=\"{{name}}\">{{name}}</option>ss\n </select>\n </div>\n\n <div *ngIf=\"dataSource.data.length > 0\" class=\"govuk-form-group float-right-padding\">\n <label class=\"govuk-label dropdpwn\" for=\"sort\">\n Filter by service:\n </label>\n <select class=\"govuk-select\" id=\"sort\" name=\"sort\" (change)=\"selectchange($event)\">\n <option value=\"\" selected='selected'>All services</option>\n <option *ngFor=\"let name of serviceLst;\" value=\"{{name}}\">{{name}}</option>\n </select>\n </div>\n\n <div *ngIf=\"dataSource.data.length > 0\" class=\"example-container\">\n\n <mat-table [dataSource]=\"dataSource\" matSort>\n\n <ng-container matColumnDef=\"ccd_case_number\">\n <mat-header-cell *matHeaderCellDef>Case reference</mat-header-cell>\n <mat-cell *matCellDef=\"let row\" class=\"whitespace-inherit\"> {{row.ccd_case_number | ccdHyphens }}</mat-cell>\n </ng-container>\n\n <ng-container matColumnDef=\"refund_reference\">\n <mat-header-cell *matHeaderCellDef> Refund reference</mat-header-cell>\n <mat-cell *matCellDef=\"let row\" class=\"whitespace-inherit\"> {{row.refund_reference}}</mat-cell>\n </ng-container>\n\n <ng-container matColumnDef=\"user_full_name\">\n <mat-header-cell *matHeaderCellDef> Submitted by</mat-header-cell>\n <mat-cell *matCellDef=\"let row\" [style.color]=\"row.color\" class=\"whitespace-inherit\"> {{row.user_full_name }}\n </mat-cell>\n </ng-container>\n\n <ng-container matColumnDef=\"date_created\">\n <mat-header-cell *matHeaderCellDef mat-sort-header> Date created</mat-header-cell>\n <mat-cell *matCellDef=\"let row\" class=\"whitespace-inherit\"> {{row.date_created | date:'d MMMM yyyy'}}</mat-cell>\n </ng-container>\n\n <ng-container matColumnDef=\"date_updated\">\n <mat-header-cell *matHeaderCellDef mat-sort-header> Last updated</mat-header-cell>\n <mat-cell *matCellDef=\"let row\" [style.color]=\"row.color\" class=\"whitespace-inherit\"> {{row.date_updated |\n date:'d MMMM yyyy'}}\n </mat-cell>\n </ng-container>\n\n <ng-container *ngIf=\"isApprovalFlow\" matColumnDef=\"Action\">\n <mat-header-cell *matHeaderCellDef> Action</mat-header-cell>\n <mat-cell *matCellDef=\"let row\" [style.color]=\"row.color\"><a href=\"javascript:void(0)\"\n (click)=\"goToCaseReview(row.ccd_case_number, row)\">Review\n case</a>&nbsp;<a href=\"javascript:void(0)\" (click)=\"goToRefundProcessComponent(row.refund_reference, row)\">Process\n refund</a></mat-cell>\n </ng-container>\n\n <ng-container *ngIf=\"!isApprovalFlow\" matColumnDef=\"Action\">\n <mat-header-cell *matHeaderCellDef> Action</mat-header-cell>\n <mat-cell *matCellDef=\"let row\" [style.color]=\"row.color\"><a href=\"javascript:void(0)\"\n (click)=\"goToRefundViewComponent(row.refund_reference, row)\">Review\n refund</a></mat-cell>\n </ng-container>\n\n <mat-header-row *matHeaderRowDef=\"displayedColumns\"></mat-header-row>\n <mat-row *matRowDef=\"let row; columns: displayedColumns;\">\n </mat-row>\n </mat-table>\n <mat-paginator [pageSizeOptions]=\"[5, 10, 25, 100]\"></mat-paginator>\n </div>\n\n <div class=\"govuk-label dropdpwn\" *ngIf=\"dataSource.data.length === 0\">No records to display</div>\n</div>\n", styles: [".mat-header-row{min-height:27px}.mat-cell{padding:0 10px 0 0;text-align:left;word-wrap:break-word;white-space:inherit!important;font-size:19px;line-height:25px;font-family:nta,Arial,sans-serif;font-weight:400}.mat-table{color:#0b0c0c;display:table;font-family:nta,Arial,sans-serif;-webkit-font-smoothing:antialiased;margin-bottom:1px;box-sizing:border-box;text-indent:initial;border-spacing:0;border-collapse:collapse;font-size:1.1875rem;line-height:1.31578947;table-layout:fixed;width:102%}.mat-header-cell,.mat-mdc-header-cell{text-align:left;font-weight:700;padding:10px 10px 10px 0;word-wrap:break-word;font-size:19px;line-height:25px;color:#0b0c0c;cursor:pointer;font-family:inherit}.mat-mdc-row,mat-header-row,mat-footer-row{border-bottom-width:1px;border-style:solid;align-items:center;box-sizing:border-box}.row.mat-mdc-row{border-bottom-width:1px;border-style:solid;align-items:center;box-sizing:border-box}.dropdpwn{display:inline-block;margin-right:10px;font-size:19px}.mat-column-ccdCaseNumber{flex:3em}.mat-column-refundReference{flex:6em}.mat-column-reason{flex:2em}.govuk-select{font-size:19px;font-weight:400}.govuk-error-summary__title{font-size:24px!important}.float-right{float:right}.float-right-padding{float:initial;padding-right:2em;padding-left:8em}.float-left-padding{padding-left:12em}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "component", type: i5.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i5.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i5.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i5.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i5.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i5.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i5.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i5.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i5.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i5.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i6.MatPaginator, selector: "mat-paginator", inputs: ["disabled"], exportAs: ["matPaginator"] }, { kind: "directive", type: i7.MatSort, selector: "[matSort]", inputs: ["matSortDisabled", "matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i7.MatSortHeader, selector: "[mat-sort-header]", inputs: ["disabled", "mat-sort-header", "arrowPosition", "start", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "pipe", type: i3.DatePipe, name: "date" }, { kind: "pipe", type: CcdHyphensPipe, name: "ccdHyphens" }] });
5926
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: TableComponent, deps: [{ token: 'PAYMENT_LIB' }, { token: i0.ChangeDetectorRef }, { token: OrderslistService }, { token: i1$2.Router }, { token: i1$2.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component });
5927
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: TableComponent, isStandalone: false, selector: "ccpay-table", inputs: { DATASOURCE: "DATASOURCE", STATUS: "STATUS", errorMessage: "errorMessage" }, viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true }], ngImport: i0, template: "<div class=\"add-remission\">\n <div *ngIf=\"errorMessage\">\n <div class=\"error-summary\" role=\"group\" aria-labelledby=\"failure-error-summary-heading\" tabindex=\"-1\">\n <h2 class=\"heading-medium error-summary-heading\" id=\"failure-error-summary-heading\">\n Error in processing the request\n </h2>\n <div class=\"govuk-error-summary__body\">\n {{ errorMessage }}\n </div>\n </div>\n </div>\n\n\n <div *ngIf=\"dataSource.data.length > 0\" class=\"govuk-form-group float-right\">\n <label class=\"govuk-label dropdpwn\" for=\"sort\">\n Filter by caseworker:\n </label>\n <select class=\"govuk-select\" id=\"sort\" name=\"sort\" (change)=\"selectchange($event)\">\n <option value=\"\" selected='selected'>All caseworkers</option>\n <option *ngFor=\"let name of userLst;\" value=\"{{name}}\">{{name}}</option>ss\n </select>\n </div>\n\n <div *ngIf=\"dataSource.data.length > 0\" class=\"govuk-form-group float-right-padding\">\n <label class=\"govuk-label dropdpwn\" for=\"sort\">\n Filter by service:\n </label>\n <select class=\"govuk-select\" id=\"sort\" name=\"sort\" (change)=\"selectchange($event)\">\n <option value=\"\" selected='selected'>All services</option>\n <option *ngFor=\"let name of serviceLst;\" value=\"{{name}}\">{{name}}</option>\n </select>\n </div>\n\n <div *ngIf=\"dataSource.data.length > 0\" class=\"example-container\">\n\n <mat-table [dataSource]=\"dataSource\" matSort>\n\n <ng-container matColumnDef=\"ccd_case_number\">\n <mat-header-cell *matHeaderCellDef>Case reference</mat-header-cell>\n <mat-cell *matCellDef=\"let row\" class=\"whitespace-inherit\"> {{row.ccd_case_number | ccdHyphens }}</mat-cell>\n </ng-container>\n\n <ng-container matColumnDef=\"refund_reference\">\n <mat-header-cell *matHeaderCellDef> Refund reference</mat-header-cell>\n <mat-cell *matCellDef=\"let row\" class=\"whitespace-inherit\"> {{row.refund_reference}}</mat-cell>\n </ng-container>\n\n <ng-container matColumnDef=\"user_full_name\">\n <mat-header-cell *matHeaderCellDef> Submitted by</mat-header-cell>\n <mat-cell *matCellDef=\"let row\" [style.color]=\"row.color\" class=\"whitespace-inherit\"> {{row.user_full_name }}\n </mat-cell>\n </ng-container>\n\n <ng-container matColumnDef=\"date_created\">\n <mat-header-cell *matHeaderCellDef mat-sort-header> Date created</mat-header-cell>\n <mat-cell *matCellDef=\"let row\" class=\"whitespace-inherit\"> {{row.date_created | date:'d MMMM yyyy'}}</mat-cell>\n </ng-container>\n\n <ng-container matColumnDef=\"date_updated\">\n <mat-header-cell *matHeaderCellDef mat-sort-header> Last updated</mat-header-cell>\n <mat-cell *matCellDef=\"let row\" [style.color]=\"row.color\" class=\"whitespace-inherit\"> {{row.date_updated |\n date:'d MMMM yyyy'}}\n </mat-cell>\n </ng-container>\n\n <ng-container *ngIf=\"isApprovalFlow\" matColumnDef=\"Action\">\n <mat-header-cell *matHeaderCellDef> Action</mat-header-cell>\n <mat-cell *matCellDef=\"let row\" [style.color]=\"row.color\"><a href=\"javascript:void(0)\"\n (click)=\"goToCaseReview(row.ccd_case_number, row)\">Review\n case</a>&nbsp;<a href=\"javascript:void(0)\" (click)=\"goToRefundProcessComponent(row.refund_reference, row)\">Process\n refund</a></mat-cell>\n </ng-container>\n\n <ng-container *ngIf=\"!isApprovalFlow\" matColumnDef=\"Action\">\n <mat-header-cell *matHeaderCellDef> Action</mat-header-cell>\n <mat-cell *matCellDef=\"let row\" [style.color]=\"row.color\"><a href=\"javascript:void(0)\"\n (click)=\"goToRefundViewComponent(row.refund_reference, row)\">Review\n refund</a></mat-cell>\n </ng-container>\n\n <mat-header-row *matHeaderRowDef=\"displayedColumns\"></mat-header-row>\n <mat-row *matRowDef=\"let row; columns: displayedColumns;\">\n </mat-row>\n </mat-table>\n <mat-paginator [pageSizeOptions]=\"[5, 10, 25, 100]\"></mat-paginator>\n </div>\n\n <div class=\"govuk-label dropdpwn\" *ngIf=\"dataSource.data.length === 0\">No records to display</div>\n</div>\n", styles: [".mat-header-row{min-height:27px}.mat-cell{padding:0 10px 0 0;text-align:left;word-wrap:break-word;white-space:inherit!important;font-size:19px;line-height:25px;font-family:nta,Arial,sans-serif;font-weight:400}.mat-table{color:#0b0c0c;display:table;font-family:nta,Arial,sans-serif;-webkit-font-smoothing:antialiased;margin-bottom:1px;box-sizing:border-box;text-indent:initial;border-spacing:0;border-collapse:collapse;font-size:1.1875rem;line-height:1.31578947;table-layout:fixed;width:102%}.mat-header-cell,.mat-mdc-header-cell{text-align:left;font-weight:700;padding:10px 10px 10px 0;word-wrap:break-word;font-size:19px;line-height:25px;color:#0b0c0c;cursor:pointer;font-family:inherit}.mat-mdc-row,mat-header-row,mat-footer-row{border-bottom-width:1px;border-style:solid;align-items:center;box-sizing:border-box}.row.mat-mdc-row{border-bottom-width:1px;border-style:solid;align-items:center;box-sizing:border-box}.dropdpwn{display:inline-block;margin-right:10px;font-size:19px}.mat-column-ccdCaseNumber{flex:3em}.mat-column-refundReference{flex:6em}.mat-column-reason{flex:2em}.govuk-select{font-size:19px;font-weight:400}.govuk-error-summary__title{font-size:24px!important}.float-right{float:right}.float-right-padding{float:initial;padding-right:2em;padding-left:8em}.float-left-padding{padding-left:12em}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "component", type: i5.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i5.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i5.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i5.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i5.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i5.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i5.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i5.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i5.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i5.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i6.MatPaginator, selector: "mat-paginator", inputs: ["disabled"], exportAs: ["matPaginator"] }, { kind: "directive", type: i7.MatSort, selector: "[matSort]", inputs: ["matSortDisabled", "matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i7.MatSortHeader, selector: "[mat-sort-header]", inputs: ["disabled", "mat-sort-header", "arrowPosition", "start", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "pipe", type: i3.DatePipe, name: "date" }, { kind: "pipe", type: CcdHyphensPipe, name: "ccdHyphens" }] });
5914
5928
  }
5915
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: TableComponent, decorators: [{
5929
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: TableComponent, decorators: [{
5916
5930
  type: Component,
5917
5931
  args: [{ selector: 'ccpay-table', standalone: false, template: "<div class=\"add-remission\">\n <div *ngIf=\"errorMessage\">\n <div class=\"error-summary\" role=\"group\" aria-labelledby=\"failure-error-summary-heading\" tabindex=\"-1\">\n <h2 class=\"heading-medium error-summary-heading\" id=\"failure-error-summary-heading\">\n Error in processing the request\n </h2>\n <div class=\"govuk-error-summary__body\">\n {{ errorMessage }}\n </div>\n </div>\n </div>\n\n\n <div *ngIf=\"dataSource.data.length > 0\" class=\"govuk-form-group float-right\">\n <label class=\"govuk-label dropdpwn\" for=\"sort\">\n Filter by caseworker:\n </label>\n <select class=\"govuk-select\" id=\"sort\" name=\"sort\" (change)=\"selectchange($event)\">\n <option value=\"\" selected='selected'>All caseworkers</option>\n <option *ngFor=\"let name of userLst;\" value=\"{{name}}\">{{name}}</option>ss\n </select>\n </div>\n\n <div *ngIf=\"dataSource.data.length > 0\" class=\"govuk-form-group float-right-padding\">\n <label class=\"govuk-label dropdpwn\" for=\"sort\">\n Filter by service:\n </label>\n <select class=\"govuk-select\" id=\"sort\" name=\"sort\" (change)=\"selectchange($event)\">\n <option value=\"\" selected='selected'>All services</option>\n <option *ngFor=\"let name of serviceLst;\" value=\"{{name}}\">{{name}}</option>\n </select>\n </div>\n\n <div *ngIf=\"dataSource.data.length > 0\" class=\"example-container\">\n\n <mat-table [dataSource]=\"dataSource\" matSort>\n\n <ng-container matColumnDef=\"ccd_case_number\">\n <mat-header-cell *matHeaderCellDef>Case reference</mat-header-cell>\n <mat-cell *matCellDef=\"let row\" class=\"whitespace-inherit\"> {{row.ccd_case_number | ccdHyphens }}</mat-cell>\n </ng-container>\n\n <ng-container matColumnDef=\"refund_reference\">\n <mat-header-cell *matHeaderCellDef> Refund reference</mat-header-cell>\n <mat-cell *matCellDef=\"let row\" class=\"whitespace-inherit\"> {{row.refund_reference}}</mat-cell>\n </ng-container>\n\n <ng-container matColumnDef=\"user_full_name\">\n <mat-header-cell *matHeaderCellDef> Submitted by</mat-header-cell>\n <mat-cell *matCellDef=\"let row\" [style.color]=\"row.color\" class=\"whitespace-inherit\"> {{row.user_full_name }}\n </mat-cell>\n </ng-container>\n\n <ng-container matColumnDef=\"date_created\">\n <mat-header-cell *matHeaderCellDef mat-sort-header> Date created</mat-header-cell>\n <mat-cell *matCellDef=\"let row\" class=\"whitespace-inherit\"> {{row.date_created | date:'d MMMM yyyy'}}</mat-cell>\n </ng-container>\n\n <ng-container matColumnDef=\"date_updated\">\n <mat-header-cell *matHeaderCellDef mat-sort-header> Last updated</mat-header-cell>\n <mat-cell *matCellDef=\"let row\" [style.color]=\"row.color\" class=\"whitespace-inherit\"> {{row.date_updated |\n date:'d MMMM yyyy'}}\n </mat-cell>\n </ng-container>\n\n <ng-container *ngIf=\"isApprovalFlow\" matColumnDef=\"Action\">\n <mat-header-cell *matHeaderCellDef> Action</mat-header-cell>\n <mat-cell *matCellDef=\"let row\" [style.color]=\"row.color\"><a href=\"javascript:void(0)\"\n (click)=\"goToCaseReview(row.ccd_case_number, row)\">Review\n case</a>&nbsp;<a href=\"javascript:void(0)\" (click)=\"goToRefundProcessComponent(row.refund_reference, row)\">Process\n refund</a></mat-cell>\n </ng-container>\n\n <ng-container *ngIf=\"!isApprovalFlow\" matColumnDef=\"Action\">\n <mat-header-cell *matHeaderCellDef> Action</mat-header-cell>\n <mat-cell *matCellDef=\"let row\" [style.color]=\"row.color\"><a href=\"javascript:void(0)\"\n (click)=\"goToRefundViewComponent(row.refund_reference, row)\">Review\n refund</a></mat-cell>\n </ng-container>\n\n <mat-header-row *matHeaderRowDef=\"displayedColumns\"></mat-header-row>\n <mat-row *matRowDef=\"let row; columns: displayedColumns;\">\n </mat-row>\n </mat-table>\n <mat-paginator [pageSizeOptions]=\"[5, 10, 25, 100]\"></mat-paginator>\n </div>\n\n <div class=\"govuk-label dropdpwn\" *ngIf=\"dataSource.data.length === 0\">No records to display</div>\n</div>\n", styles: [".mat-header-row{min-height:27px}.mat-cell{padding:0 10px 0 0;text-align:left;word-wrap:break-word;white-space:inherit!important;font-size:19px;line-height:25px;font-family:nta,Arial,sans-serif;font-weight:400}.mat-table{color:#0b0c0c;display:table;font-family:nta,Arial,sans-serif;-webkit-font-smoothing:antialiased;margin-bottom:1px;box-sizing:border-box;text-indent:initial;border-spacing:0;border-collapse:collapse;font-size:1.1875rem;line-height:1.31578947;table-layout:fixed;width:102%}.mat-header-cell,.mat-mdc-header-cell{text-align:left;font-weight:700;padding:10px 10px 10px 0;word-wrap:break-word;font-size:19px;line-height:25px;color:#0b0c0c;cursor:pointer;font-family:inherit}.mat-mdc-row,mat-header-row,mat-footer-row{border-bottom-width:1px;border-style:solid;align-items:center;box-sizing:border-box}.row.mat-mdc-row{border-bottom-width:1px;border-style:solid;align-items:center;box-sizing:border-box}.dropdpwn{display:inline-block;margin-right:10px;font-size:19px}.mat-column-ccdCaseNumber{flex:3em}.mat-column-refundReference{flex:6em}.mat-column-reason{flex:2em}.govuk-select{font-size:19px;font-weight:400}.govuk-error-summary__title{font-size:24px!important}.float-right{float:right}.float-right-padding{float:initial;padding-right:2em;padding-left:8em}.float-left-padding{padding-left:12em}\n"] }]
5918
5932
  }], ctorParameters: () => [{ type: undefined, decorators: [{
@@ -5985,10 +5999,10 @@ class RefundListComponent {
5985
5999
  this.errorMessage = error.replace(/"/g, "");
5986
6000
  };
5987
6001
  }
5988
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: RefundListComponent, deps: [{ token: RefundsService }], target: i0.ɵɵFactoryTarget.Component });
5989
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.1", type: RefundListComponent, isStandalone: false, selector: "ccpay-refund-list", inputs: { USERID: "USERID", LOGGEDINUSERROLES: "LOGGEDINUSERROLES", LOGGEDINUSEREMAIL: "LOGGEDINUSEREMAIL" }, ngImport: i0, template: "\n\n<div class=\"hmcts-page-heading\">\n <div class=\"hmcts-page-heading__title\">\n <h1 class=\"govuk-heading-xl\">Refund list</h1>\n </div>\n</div>\n\n<ng-container *ngIf=\"isAuthorized\">\n<div class=\"hmcts-page-heading\">\n <div class=\"hmcts-page-heading__title\">\n <h2 class=\"govuk-heading-l\">{{tableApprovalHeader}}</h2>\n </div>\n </div>\n <div *ngIf=\"!isApproveTableVisible\">\n <div class=\"govuk-label dropdpwn\" >No records to display</div>\n </div>\n</ng-container>\n \n<ng-container *ngIf=\"isApproveTableVisible\">\n \n <div><ccpay-table [DATASOURCE]=\"submittedRefundList\" [STATUS]=\"approvalStatus\" [errorMessage]=\"errorMessage\"></ccpay-table></div>\n</ng-container>\n\n\n<div class=\"hmcts-page-heading\">\n <div class=\"hmcts-page-heading__title\">\n <h2 class=\"govuk-heading-l\">{{tableRejectedHeader}}</h2>\n </div>\n \n </div>\n <div *ngIf=\"!isRejectTableVisible\">\n <div class=\"govuk-label dropdpwn\">No records to display</div>\n </div>\n<ng-container *ngIf=\"isRejectTableVisible\">\n \n <div><ccpay-table [DATASOURCE]=\"rejectedRefundList\" [STATUS]=\"rejectStatus\" [errorMessage]=\"errorMessage\"></ccpay-table></div>\n</ng-container>\n\n\n", styles: [".govuk-heading-xl{font-size:48px;padding-top:1em}.govuk-heading-l{font-size:36px}.govuk-label{font-size:19px}.hmcts-page-heading{width:110%}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: TableComponent, selector: "ccpay-table", inputs: ["DATASOURCE", "STATUS", "errorMessage"] }] });
6002
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: RefundListComponent, deps: [{ token: RefundsService }], target: i0.ɵɵFactoryTarget.Component });
6003
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: RefundListComponent, isStandalone: false, selector: "ccpay-refund-list", inputs: { USERID: "USERID", LOGGEDINUSERROLES: "LOGGEDINUSERROLES", LOGGEDINUSEREMAIL: "LOGGEDINUSEREMAIL" }, ngImport: i0, template: "\n\n<div class=\"hmcts-page-heading\">\n <div class=\"hmcts-page-heading__title\">\n <h1 class=\"govuk-heading-xl\">Refund list</h1>\n </div>\n</div>\n\n<ng-container *ngIf=\"isAuthorized\">\n<div class=\"hmcts-page-heading\">\n <div class=\"hmcts-page-heading__title\">\n <h2 class=\"govuk-heading-l\">{{tableApprovalHeader}}</h2>\n </div>\n </div>\n <div *ngIf=\"!isApproveTableVisible\">\n <div class=\"govuk-label dropdpwn\" >No records to display</div>\n </div>\n</ng-container>\n \n<ng-container *ngIf=\"isApproveTableVisible\">\n \n <div><ccpay-table [DATASOURCE]=\"submittedRefundList\" [STATUS]=\"approvalStatus\" [errorMessage]=\"errorMessage\"></ccpay-table></div>\n</ng-container>\n\n\n<div class=\"hmcts-page-heading\">\n <div class=\"hmcts-page-heading__title\">\n <h2 class=\"govuk-heading-l\">{{tableRejectedHeader}}</h2>\n </div>\n \n </div>\n <div *ngIf=\"!isRejectTableVisible\">\n <div class=\"govuk-label dropdpwn\">No records to display</div>\n </div>\n<ng-container *ngIf=\"isRejectTableVisible\">\n \n <div><ccpay-table [DATASOURCE]=\"rejectedRefundList\" [STATUS]=\"rejectStatus\" [errorMessage]=\"errorMessage\"></ccpay-table></div>\n</ng-container>\n\n\n", styles: [".govuk-heading-xl{font-size:48px;padding-top:1em}.govuk-heading-l{font-size:36px}.govuk-label{font-size:19px}.hmcts-page-heading{width:110%}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: TableComponent, selector: "ccpay-table", inputs: ["DATASOURCE", "STATUS", "errorMessage"] }] });
5990
6004
  }
5991
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: RefundListComponent, decorators: [{
6005
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: RefundListComponent, decorators: [{
5992
6006
  type: Component,
5993
6007
  args: [{ selector: 'ccpay-refund-list', standalone: false, template: "\n\n<div class=\"hmcts-page-heading\">\n <div class=\"hmcts-page-heading__title\">\n <h1 class=\"govuk-heading-xl\">Refund list</h1>\n </div>\n</div>\n\n<ng-container *ngIf=\"isAuthorized\">\n<div class=\"hmcts-page-heading\">\n <div class=\"hmcts-page-heading__title\">\n <h2 class=\"govuk-heading-l\">{{tableApprovalHeader}}</h2>\n </div>\n </div>\n <div *ngIf=\"!isApproveTableVisible\">\n <div class=\"govuk-label dropdpwn\" >No records to display</div>\n </div>\n</ng-container>\n \n<ng-container *ngIf=\"isApproveTableVisible\">\n \n <div><ccpay-table [DATASOURCE]=\"submittedRefundList\" [STATUS]=\"approvalStatus\" [errorMessage]=\"errorMessage\"></ccpay-table></div>\n</ng-container>\n\n\n<div class=\"hmcts-page-heading\">\n <div class=\"hmcts-page-heading__title\">\n <h2 class=\"govuk-heading-l\">{{tableRejectedHeader}}</h2>\n </div>\n \n </div>\n <div *ngIf=\"!isRejectTableVisible\">\n <div class=\"govuk-label dropdpwn\">No records to display</div>\n </div>\n<ng-container *ngIf=\"isRejectTableVisible\">\n \n <div><ccpay-table [DATASOURCE]=\"rejectedRefundList\" [STATUS]=\"rejectStatus\" [errorMessage]=\"errorMessage\"></ccpay-table></div>\n</ng-container>\n\n\n", styles: [".govuk-heading-xl{font-size:48px;padding-top:1em}.govuk-heading-l{font-size:36px}.govuk-label{font-size:19px}.hmcts-page-heading{width:110%}\n"] }]
5994
6008
  }], ctorParameters: () => [{ type: RefundsService }], propDecorators: { USERID: [{
@@ -6064,10 +6078,10 @@ class ErrorBannerComponent {
6064
6078
  constructor() { }
6065
6079
  ngOnInit() {
6066
6080
  }
6067
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: ErrorBannerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
6068
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.1", type: ErrorBannerComponent, isStandalone: false, selector: "ccpay-error-banner", inputs: { errorMessage: "errorMessage" }, ngImport: i0, template: "<div class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" tabindex=\"-1\" data-module=\"govuk-error-summary\">\n <h2 class=\"govuk-error-summary__title govuk-error-summary__title-custom\" id=\"error-summary-title\">\n {{errorMessage.title}}\n </h2>\n <div class=\"govuk-error-summary__body\">\n <ul class=\"govuk-list govuk-error-summary__list\">\n <li>\n {{errorMessage.body}}\n </li>\n </ul>\n </div>\n</div>", styles: [".govuk-error-summary h2{font-size:24px}.govuk-error-summary__list li{font-size:19px}\n"] });
6081
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: ErrorBannerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
6082
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: ErrorBannerComponent, isStandalone: false, selector: "ccpay-error-banner", inputs: { errorMessage: "errorMessage" }, ngImport: i0, template: "<div class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" tabindex=\"-1\" data-module=\"govuk-error-summary\">\n <h2 class=\"govuk-error-summary__title govuk-error-summary__title-custom\" id=\"error-summary-title\">\n {{errorMessage.title}}\n </h2>\n <div class=\"govuk-error-summary__body\">\n <ul class=\"govuk-list govuk-error-summary__list\">\n <li>\n {{errorMessage.body}}\n </li>\n </ul>\n </div>\n</div>", styles: [".govuk-error-summary h2{font-size:24px}.govuk-error-summary__list li{font-size:19px}\n"] });
6069
6083
  }
6070
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: ErrorBannerComponent, decorators: [{
6084
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: ErrorBannerComponent, decorators: [{
6071
6085
  type: Component,
6072
6086
  args: [{ selector: 'ccpay-error-banner', standalone: false, template: "<div class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" tabindex=\"-1\" data-module=\"govuk-error-summary\">\n <h2 class=\"govuk-error-summary__title govuk-error-summary__title-custom\" id=\"error-summary-title\">\n {{errorMessage.title}}\n </h2>\n <div class=\"govuk-error-summary__body\">\n <ul class=\"govuk-list govuk-error-summary__list\">\n <li>\n {{errorMessage.body}}\n </li>\n </ul>\n </div>\n</div>", styles: [".govuk-error-summary h2{font-size:24px}.govuk-error-summary__list li{font-size:19px}\n"] }]
6073
6087
  }], ctorParameters: () => [], propDecorators: { errorMessage: [{
@@ -6245,10 +6259,10 @@ class MarkUnidentifiedPaymentComponent {
6245
6259
  showError: isErrorExist
6246
6260
  };
6247
6261
  }
6248
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: MarkUnidentifiedPaymentComponent, deps: [{ token: i1$1.FormBuilder }, { token: PaymentViewService }, { token: 'PAYMENT_LIB' }, { token: BulkScaningPaymentService }], target: i0.ɵɵFactoryTarget.Component });
6249
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.1", type: MarkUnidentifiedPaymentComponent, isStandalone: false, selector: "app-mark-unidentified-payment", inputs: { caseType: "caseType" }, ngImport: i0, template: "<div class=\"mkpay-unidentified\" >\n <div *ngIf=\"viewStatus === 'mainForm'\">\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='MARKUNIDENTIFIED'>\n <h1 class=\"heading-large\">Mark payment as unidentified</h1>\n\n <div class=\"govuk-grid-column-full govuk-!-padding-bottom-3\">\n <hr class=\"govuk-section-break govuk-section-break--visible\">\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\">Payment asset number (DCN)</td>\n <td class=\"govuk-table__header\" scope=\"col\">Banked date</td>\n <td class=\"govuk-table__header\" scope=\"col\">Amount</td>\n <td class=\"govuk-table__header\" scope=\"col\">Method</td>\n \n </tr>\n </thead>\n <tbody class=\"govuk-table__body\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell\">{{unassignedRecord.dcn_reference}}</td>\n <td class=\"govuk-table__cell\"> {{unassignedRecord.date_banked | date:'dd MMM yyyy'}}</td>\n <td class=\"govuk-table__cell\"> {{unassignedRecord.amount | currency :'GBP':'symbol':'1.2-2'}}</td>\n <td class=\"capitalize govuk-table__cell\"> {{trimUnderscore(unassignedRecord.payment_method) | lowercase}} </td>\n </tr>\n </tbody>\n </table>\n </div>\n <form [formGroup]=\"markPaymentUnidentifiedForm\" novalidate>\n <div class=\"govuk-form-group\">\n <p class=\"unidentifiedSubText\">\n Give a reason for marking this payment as unidentified.\n <br/>\n Include any investigations you've made.\n </p>\n <label class=\"heading-small\" for=\"investicationDetail\">\n\n </label>\n <textarea class=\"form-control form-control-3-4\" [ngClass]=\"{'inline-error-class': isInvesticationDetailEmpty || investicationDetailHasError || investicationDetailMinHasError || investicationDetailMaxHasError}\" name=\"investicationDetail\" id=\"investicationDetail\" rows=\"5\" formControlName=\"investicationDetail\">\n </textarea>\n <p class=\"inline-error-message\" *ngIf=\"isInvesticationDetailEmpty || investicationDetailHasError || investicationDetailMinHasError || investicationDetailMaxHasError\">\n <span *ngIf=\"isInvesticationDetailEmpty\">Enter a reason for marking this payment as unidentified.</span>\n <span *ngIf=\"investicationDetailHasError\">Enter a vaild reason</span>\n <span *ngIf=\"investicationDetailMinHasError\">Reason should be at least 3 characters.</span>\n <span *ngIf=\"investicationDetailMaxHasError\">Reason should be 255 characters or under.</span>\n </p>\n </div>\n <div class=\"govuk-button--group\">\n <button type=\"submit\" class=\"button\" (click)=\"saveAndContinue()\">\n Continue\n </button>\n <button type=\"button\" class=\"button govuk-button--secondary\" (click)=\"cancelMarkUnidentifiedPayments('cancel')\">\n Cancel\n </button>\n </div>\n </form>\n </div>\n <ng-container *ngIf=\"viewStatus === 'unidentifiedContinueConfirm'\">\n <ccpay-error-banner *ngIf=\"errorMessage.showError\" [errorMessage]=\"errorMessage\"></ccpay-error-banner>\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='UNIDENTIFIEDCONFIRMATION'>\n <div class=\"govuk-warning-text\">\n <span class=\"govuk-warning-text__icon\" aria-hidden=\"true\">!</span>\n <strong class=\"govuk-warning-text__text\">\n <span class=\"govuk-warning-text__assistive\">Warning</span>\n <h1 class=\"heading-small\"> Are you sure you want to mark this payment as unidentified? </h1>\n \n </strong>\n\n <div class=\"govuk-grid-column-full govuk-!-padding-bottom-3\">\n <hr class=\"govuk-section-break govuk-section-break--visible\">\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\">Investigations</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell\">{{investigationComment}}</td>\n </tr>\n </tbody>\n </table>\n </div>\n\n </div>\n <div class=\"govuk-button--group\">\n <button type=\"submit\" class=\"button\" [disabled]=\"isConfirmButtondisabled\" (click)=\"confirmPayments()\">\n Confirm\n </button>\n <button type=\"button\" class=\"button govuk-button--secondary\" (click)=\"cancelMarkUnidentifiedPayments()\">\n Cancel\n </button>\n </div>\n </ng-container>\n <ng-container *ngIf=\"viewStatus === 'unidentifiedCancelConfirm'\">\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='CANCELUNIDENTIFIED'>\n <div class=\"govuk-warning-text\">\n <span class=\"govuk-warning-text__icon\" aria-hidden=\"true\">!</span>\n <strong class=\"govuk-warning-text__text\">\n <span class=\"govuk-warning-text__assistive\">Warning</span>\n Are you sure you want to cancel?\n </strong>\n </div>\n <div class=\"govuk-button--group\">\n <button type=\"submit\" class=\"button\" (click)=\"gotoCasetransationPage()\">\n Yes\n </button>\n <button type=\"button\" class=\"button govuk-button--secondary\" (click)=\"cancelMarkUnidentifiedPayments()\">\n No\n </button>\n </div>\n </ng-container>\n</div>\n", styles: [".mkpay-unidentified{margin:10px 0 20px}.mkpay-unidentified .govuk-button--group .govuk-button--secondary{margin-left:10px;background-color:#b3b8bdf2}.mkpay-unidentified .inline-error-class{outline:3px solid #a71414;outline-offset:0}.mkpay-unidentified .inline-error-message{color:#a71414;font-weight:700;margin-top:10px}.govuk-grid-column-full{padding:0}.unidentifiedSubText{line-height:45px}.govuk-warning-text__text{font-size:19px}.lowercase{text-transform:lowercase}.capitalize{text-transform:capitalize}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: ErrorBannerComponent, selector: "ccpay-error-banner", inputs: ["errorMessage"] }, { kind: "pipe", type: i3.LowerCasePipe, name: "lowercase" }, { kind: "pipe", type: i3.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i3.DatePipe, name: "date" }] });
6262
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: MarkUnidentifiedPaymentComponent, deps: [{ token: i1$1.FormBuilder }, { token: PaymentViewService }, { token: 'PAYMENT_LIB' }, { token: BulkScaningPaymentService }], target: i0.ɵɵFactoryTarget.Component });
6263
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: MarkUnidentifiedPaymentComponent, isStandalone: false, selector: "app-mark-unidentified-payment", inputs: { caseType: "caseType" }, ngImport: i0, template: "<div class=\"mkpay-unidentified\" >\n <div *ngIf=\"viewStatus === 'mainForm'\">\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='MARKUNIDENTIFIED'>\n <h1 class=\"heading-large\">Mark payment as unidentified</h1>\n\n <div class=\"govuk-grid-column-full govuk-!-padding-bottom-3\">\n <hr class=\"govuk-section-break govuk-section-break--visible\">\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\">Payment asset number (DCN)</td>\n <td class=\"govuk-table__header\" scope=\"col\">Banked date</td>\n <td class=\"govuk-table__header\" scope=\"col\">Amount</td>\n <td class=\"govuk-table__header\" scope=\"col\">Method</td>\n \n </tr>\n </thead>\n <tbody class=\"govuk-table__body\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell\">{{unassignedRecord.dcn_reference}}</td>\n <td class=\"govuk-table__cell\"> {{unassignedRecord.date_banked | date:'dd MMM yyyy'}}</td>\n <td class=\"govuk-table__cell\"> {{unassignedRecord.amount | currency :'GBP':'symbol':'1.2-2'}}</td>\n <td class=\"capitalize govuk-table__cell\"> {{trimUnderscore(unassignedRecord.payment_method) | lowercase}} </td>\n </tr>\n </tbody>\n </table>\n </div>\n <form [formGroup]=\"markPaymentUnidentifiedForm\" novalidate>\n <div class=\"govuk-form-group\">\n <p class=\"unidentifiedSubText\">\n Give a reason for marking this payment as unidentified.\n <br/>\n Include any investigations you've made.\n </p>\n <label class=\"heading-small\" for=\"investicationDetail\">\n\n </label>\n <textarea class=\"form-control form-control-3-4\" [ngClass]=\"{'inline-error-class': isInvesticationDetailEmpty || investicationDetailHasError || investicationDetailMinHasError || investicationDetailMaxHasError}\" name=\"investicationDetail\" id=\"investicationDetail\" rows=\"5\" formControlName=\"investicationDetail\">\n </textarea>\n <p class=\"inline-error-message\" *ngIf=\"isInvesticationDetailEmpty || investicationDetailHasError || investicationDetailMinHasError || investicationDetailMaxHasError\">\n <span *ngIf=\"isInvesticationDetailEmpty\">Enter a reason for marking this payment as unidentified.</span>\n <span *ngIf=\"investicationDetailHasError\">Enter a vaild reason</span>\n <span *ngIf=\"investicationDetailMinHasError\">Reason should be at least 3 characters.</span>\n <span *ngIf=\"investicationDetailMaxHasError\">Reason should be 255 characters or under.</span>\n </p>\n </div>\n <div class=\"govuk-button--group\">\n <button type=\"submit\" class=\"button\" (click)=\"saveAndContinue()\">\n Continue\n </button>\n <button type=\"button\" class=\"button govuk-button--secondary\" (click)=\"cancelMarkUnidentifiedPayments('cancel')\">\n Cancel\n </button>\n </div>\n </form>\n </div>\n <ng-container *ngIf=\"viewStatus === 'unidentifiedContinueConfirm'\">\n <ccpay-error-banner *ngIf=\"errorMessage.showError\" [errorMessage]=\"errorMessage\"></ccpay-error-banner>\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='UNIDENTIFIEDCONFIRMATION'>\n <div class=\"govuk-warning-text\">\n <span class=\"govuk-warning-text__icon\" aria-hidden=\"true\">!</span>\n <strong class=\"govuk-warning-text__text\">\n <span class=\"govuk-warning-text__assistive\">Warning</span>\n <h1 class=\"heading-small\"> Are you sure you want to mark this payment as unidentified? </h1>\n \n </strong>\n\n <div class=\"govuk-grid-column-full govuk-!-padding-bottom-3\">\n <hr class=\"govuk-section-break govuk-section-break--visible\">\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\">Investigations</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell\">{{investigationComment}}</td>\n </tr>\n </tbody>\n </table>\n </div>\n\n </div>\n <div class=\"govuk-button--group\">\n <button type=\"submit\" class=\"button\" [disabled]=\"isConfirmButtondisabled\" (click)=\"confirmPayments()\">\n Confirm\n </button>\n <button type=\"button\" class=\"button govuk-button--secondary\" (click)=\"cancelMarkUnidentifiedPayments()\">\n Cancel\n </button>\n </div>\n </ng-container>\n <ng-container *ngIf=\"viewStatus === 'unidentifiedCancelConfirm'\">\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='CANCELUNIDENTIFIED'>\n <div class=\"govuk-warning-text\">\n <span class=\"govuk-warning-text__icon\" aria-hidden=\"true\">!</span>\n <strong class=\"govuk-warning-text__text\">\n <span class=\"govuk-warning-text__assistive\">Warning</span>\n Are you sure you want to cancel?\n </strong>\n </div>\n <div class=\"govuk-button--group\">\n <button type=\"submit\" class=\"button\" (click)=\"gotoCasetransationPage()\">\n Yes\n </button>\n <button type=\"button\" class=\"button govuk-button--secondary\" (click)=\"cancelMarkUnidentifiedPayments()\">\n No\n </button>\n </div>\n </ng-container>\n</div>\n", styles: [".mkpay-unidentified{margin:10px 0 20px}.mkpay-unidentified .govuk-button--group .govuk-button--secondary{margin-left:10px;background-color:#b3b8bdf2}.mkpay-unidentified .inline-error-class{outline:3px solid #a71414;outline-offset:0}.mkpay-unidentified .inline-error-message{color:#a71414;font-weight:700;margin-top:10px}.govuk-grid-column-full{padding:0}.unidentifiedSubText{line-height:45px}.govuk-warning-text__text{font-size:19px}.lowercase{text-transform:lowercase}.capitalize{text-transform:capitalize}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: ErrorBannerComponent, selector: "ccpay-error-banner", inputs: ["errorMessage"] }, { kind: "pipe", type: i3.LowerCasePipe, name: "lowercase" }, { kind: "pipe", type: i3.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i3.DatePipe, name: "date" }] });
6250
6264
  }
6251
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: MarkUnidentifiedPaymentComponent, decorators: [{
6265
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: MarkUnidentifiedPaymentComponent, decorators: [{
6252
6266
  type: Component,
6253
6267
  args: [{ selector: 'app-mark-unidentified-payment', standalone: false, template: "<div class=\"mkpay-unidentified\" >\n <div *ngIf=\"viewStatus === 'mainForm'\">\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='MARKUNIDENTIFIED'>\n <h1 class=\"heading-large\">Mark payment as unidentified</h1>\n\n <div class=\"govuk-grid-column-full govuk-!-padding-bottom-3\">\n <hr class=\"govuk-section-break govuk-section-break--visible\">\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\">Payment asset number (DCN)</td>\n <td class=\"govuk-table__header\" scope=\"col\">Banked date</td>\n <td class=\"govuk-table__header\" scope=\"col\">Amount</td>\n <td class=\"govuk-table__header\" scope=\"col\">Method</td>\n \n </tr>\n </thead>\n <tbody class=\"govuk-table__body\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell\">{{unassignedRecord.dcn_reference}}</td>\n <td class=\"govuk-table__cell\"> {{unassignedRecord.date_banked | date:'dd MMM yyyy'}}</td>\n <td class=\"govuk-table__cell\"> {{unassignedRecord.amount | currency :'GBP':'symbol':'1.2-2'}}</td>\n <td class=\"capitalize govuk-table__cell\"> {{trimUnderscore(unassignedRecord.payment_method) | lowercase}} </td>\n </tr>\n </tbody>\n </table>\n </div>\n <form [formGroup]=\"markPaymentUnidentifiedForm\" novalidate>\n <div class=\"govuk-form-group\">\n <p class=\"unidentifiedSubText\">\n Give a reason for marking this payment as unidentified.\n <br/>\n Include any investigations you've made.\n </p>\n <label class=\"heading-small\" for=\"investicationDetail\">\n\n </label>\n <textarea class=\"form-control form-control-3-4\" [ngClass]=\"{'inline-error-class': isInvesticationDetailEmpty || investicationDetailHasError || investicationDetailMinHasError || investicationDetailMaxHasError}\" name=\"investicationDetail\" id=\"investicationDetail\" rows=\"5\" formControlName=\"investicationDetail\">\n </textarea>\n <p class=\"inline-error-message\" *ngIf=\"isInvesticationDetailEmpty || investicationDetailHasError || investicationDetailMinHasError || investicationDetailMaxHasError\">\n <span *ngIf=\"isInvesticationDetailEmpty\">Enter a reason for marking this payment as unidentified.</span>\n <span *ngIf=\"investicationDetailHasError\">Enter a vaild reason</span>\n <span *ngIf=\"investicationDetailMinHasError\">Reason should be at least 3 characters.</span>\n <span *ngIf=\"investicationDetailMaxHasError\">Reason should be 255 characters or under.</span>\n </p>\n </div>\n <div class=\"govuk-button--group\">\n <button type=\"submit\" class=\"button\" (click)=\"saveAndContinue()\">\n Continue\n </button>\n <button type=\"button\" class=\"button govuk-button--secondary\" (click)=\"cancelMarkUnidentifiedPayments('cancel')\">\n Cancel\n </button>\n </div>\n </form>\n </div>\n <ng-container *ngIf=\"viewStatus === 'unidentifiedContinueConfirm'\">\n <ccpay-error-banner *ngIf=\"errorMessage.showError\" [errorMessage]=\"errorMessage\"></ccpay-error-banner>\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='UNIDENTIFIEDCONFIRMATION'>\n <div class=\"govuk-warning-text\">\n <span class=\"govuk-warning-text__icon\" aria-hidden=\"true\">!</span>\n <strong class=\"govuk-warning-text__text\">\n <span class=\"govuk-warning-text__assistive\">Warning</span>\n <h1 class=\"heading-small\"> Are you sure you want to mark this payment as unidentified? </h1>\n \n </strong>\n\n <div class=\"govuk-grid-column-full govuk-!-padding-bottom-3\">\n <hr class=\"govuk-section-break govuk-section-break--visible\">\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\">Investigations</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell\">{{investigationComment}}</td>\n </tr>\n </tbody>\n </table>\n </div>\n\n </div>\n <div class=\"govuk-button--group\">\n <button type=\"submit\" class=\"button\" [disabled]=\"isConfirmButtondisabled\" (click)=\"confirmPayments()\">\n Confirm\n </button>\n <button type=\"button\" class=\"button govuk-button--secondary\" (click)=\"cancelMarkUnidentifiedPayments()\">\n Cancel\n </button>\n </div>\n </ng-container>\n <ng-container *ngIf=\"viewStatus === 'unidentifiedCancelConfirm'\">\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='CANCELUNIDENTIFIED'>\n <div class=\"govuk-warning-text\">\n <span class=\"govuk-warning-text__icon\" aria-hidden=\"true\">!</span>\n <strong class=\"govuk-warning-text__text\">\n <span class=\"govuk-warning-text__assistive\">Warning</span>\n Are you sure you want to cancel?\n </strong>\n </div>\n <div class=\"govuk-button--group\">\n <button type=\"submit\" class=\"button\" (click)=\"gotoCasetransationPage()\">\n Yes\n </button>\n <button type=\"button\" class=\"button govuk-button--secondary\" (click)=\"cancelMarkUnidentifiedPayments()\">\n No\n </button>\n </div>\n </ng-container>\n</div>\n", styles: [".mkpay-unidentified{margin:10px 0 20px}.mkpay-unidentified .govuk-button--group .govuk-button--secondary{margin-left:10px;background-color:#b3b8bdf2}.mkpay-unidentified .inline-error-class{outline:3px solid #a71414;outline-offset:0}.mkpay-unidentified .inline-error-message{color:#a71414;font-weight:700;margin-top:10px}.govuk-grid-column-full{padding:0}.unidentifiedSubText{line-height:45px}.govuk-warning-text__text{font-size:19px}.lowercase{text-transform:lowercase}.capitalize{text-transform:capitalize}\n"] }]
6254
6268
  }], ctorParameters: () => [{ type: i1$1.FormBuilder }, { type: PaymentViewService }, { type: undefined, decorators: [{
@@ -6530,10 +6544,10 @@ class MarkUnsolicitedPaymentComponent {
6530
6544
  this.selectedSiteId = args.target.value;
6531
6545
  this.selectedSiteName = args.target.options[args.target.selectedIndex].text;
6532
6546
  }
6533
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: MarkUnsolicitedPaymentComponent, deps: [{ token: i1$1.FormBuilder }, { token: PaymentViewService }, { token: 'PAYMENT_LIB' }, { token: BulkScaningPaymentService }], target: i0.ɵɵFactoryTarget.Component });
6534
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.1", type: MarkUnsolicitedPaymentComponent, isStandalone: false, selector: "app-mark-unsolicited-payment", inputs: { caseType: "caseType" }, ngImport: i0, template: "<div class=\"mkpay-unidentified\">\n <div *ngIf=\"viewStatus === 'mainForm'\">\n <ccpay-error-banner *ngIf=\"errorMessage.showError\" [errorMessage]=\"errorMessage\"></ccpay-error-banner>\n <h1 class=\"heading-large\">Mark payment as transferred</h1>\n <div class=\"govuk-grid-column-full govuk-!-padding-bottom-3\">\n <hr class=\"govuk-section-break govuk-section-break--visible\">\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\">Payment asset number (DCN)</td>\n <td class=\"govuk-table__header\" scope=\"col\">Banked date</td>\n <td class=\"govuk-table__header\" scope=\"col\">Amount</td>\n <td class=\"govuk-table__header\" scope=\"col\">Method</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell\">{{unassignedRecord.dcn_reference}}</td>\n <td class=\"govuk-table__cell\"> {{unassignedRecord.date_banked | date:'dd MMM yyyy'}}</td>\n <td class=\"govuk-table__cell\"> {{unassignedRecord.amount | currency :'GBP':'symbol':'1.2-2'}}</td>\n <td class=\"capitalize govuk-table__cell\"> {{trimUnderscore(unassignedRecord.payment_method) | lowercase}} </td>\n </tr>\n </tbody>\n </table>\n </div>\n \n <form [formGroup]=\"markPaymentUnsolicitedForm\" novalidate>\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='MARKTRANSFERRED'>\n <div class=\"govuk-form-group\">\n <label class=\"govuk-label custom-govuk-label custom-govuk-label\" for=\"reason\">\n Reason for payment being marked as transferred \n </label>\n <textarea class=\"form-control form-control-3-4\" [ngClass]=\"{'inline-error-class': reasonHasError || reasonMinHasError || reasonMaxHasError}\" name=\"reason\" id=\"reason\" rows=\"5\" formControlName=\"reason\">\n </textarea>\n <p class=\"inline-error-message\" *ngIf=\"isReasonEmpty || reasonHasError || reasonMinHasError || reasonMaxHasError\">\n <span *ngIf=\"isReasonEmpty\">Enter a reason for marking this payment as transferred.</span>\n <span *ngIf=\"reasonHasError\">Enter a valid reason</span>\n <span *ngIf=\"reasonMinHasError\">Reason should be at least 3 characters.</span>\n <span *ngIf=\"reasonMaxHasError\">Reason should be 255 characters or under.</span>\n </p>\n </div>\n <div class=\"govuk-form-group\">\n <label class=\"govuk-label custom-govuk-label\" for=\"responsibleOffice\">\n Receiving Site ID (Receiving court/Bulk centre site ID) \n </label>\n <select class=\"form-control short-input\" id=\"responsibleOffice\" formControlName=\"responsibleOffice\" (change)=\"selectchange($event)\">\n <option value=\"\" selected='selected'>Please select</option>\n <option *ngFor=\"let siteID of siteIDList;\" value=\"{{siteID.siteId}}\">{{siteID.siteName}} ({{siteID.siteId}})</option>\n </select>\n <p class=\"inline-error-message\" *ngIf=\"isResponsibleOfficeEmpty || responsibleOfficeHasError\">\n <span *ngIf=\"isResponsibleOfficeEmpty\">Please select Receiving Site ID</span>\n <span *ngIf=\"responsibleOfficeHasError\">Please select a valid Receiving Site ID</span>\n </p>\n </div>\n <div class=\"govuk-button--group\">\n <button type=\"submit\" [disabled]=\"isContinueButtondisabled\" class=\"button\" (click)=\"saveAndContinue()\">\n Confirm\n </button>\n <button type=\"button\" class=\"button govuk-button--secondary\" (click)=\"cancelMarkUnsolicitedPayments('cancel')\">\n Cancel\n </button>\n </div>\n </form>\n \n</div>\n <ng-container *ngIf=\"viewStatus === 'unsolicitedContinueConfirm'\">\n <ccpay-error-banner *ngIf=\"errorMessage.showError\" [errorMessage]=\"errorMessage\"></ccpay-error-banner>\n <div class=\"govuk-warning-text\">\n <span class=\"govuk-warning-text__icon\" aria-hidden=\"true\">!</span>\n <strong class=\"govuk-warning-text__text\">\n <span class=\"govuk-warning-text__assistive\">Warning</span>\n <h1 class=\"heading-small\"> Are you sure you want to mark this payment as transferred? </h1>\n </strong>\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='TRANSFERREDCONFIRMATION'>\n <div class=\"govuk-grid-column-full govuk-!-padding-bottom-3\">\n <hr class=\"govuk-section-break govuk-section-break--visible\">\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\">Reason</td>\n <td class=\"govuk-table__header\" scope=\"col\">Receiving site ID</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell\">{{reason}}</td>\n <td class=\"govuk-table__cell\">{{selectedSiteName}}</td>\n </tr>\n </tbody>\n </table>\n </div>\n\n </div>\n <div class=\"govuk-button--group\">\n <button type=\"submit\" class=\"button\" [disabled]=\"isConfirmButtondisabled\" (click)=\"confirmPayments()\">\n Confirm\n </button>\n <button type=\"button\" class=\"button govuk-button--secondary\" (click)=\"cancelMarkUnsolicitedPayments()\">\n Cancel\n </button>\n </div>\n </ng-container>\n <ng-container *ngIf=\"viewStatus === 'unsolicitedCancelConfirm'\">\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='CANCELTRANSFERRED'>\n <div class=\"govuk-warning-text\">\n <span class=\"govuk-warning-text__icon\" aria-hidden=\"true\">!</span>\n <strong class=\"govuk-warning-text__text\">\n <span class=\"govuk-warning-text__assistive\">Warning</span>\n Are you sure you want to cancel?\n </strong>\n </div>\n <div class=\"govuk-button--group\">\n <button type=\"submit\" class=\"button\" (click)=\"gotoCasetransationPage()\">\n Yes\n </button>\n <button type=\"button\" class=\"button govuk-button--secondary\" (click)=\"cancelMarkUnsolicitedPayments()\">\n No\n </button>\n </div>\n </ng-container>\n</div>", styles: [".mkpay-unidentified{margin:10px 0 20px}.mkpay-unidentified .govuk-button--secondary{margin-left:10px;background-color:#b3b8bdf2}.mkpay-unidentified .inline-error-class{outline:3px solid #a71414;outline-offset:0}.mkpay-unidentified .inline-error-message{color:#a71414;font-weight:700;margin-top:10px}.lowercase{text-transform:lowercase}.capitalize{text-transform:capitalize}.custom-govuk-label,.govuk-warning-text__text{font-size:19px}#responsibleOffice{color:#000;width:75%;font-weight:white}select option{background:#fff}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: ErrorBannerComponent, selector: "ccpay-error-banner", inputs: ["errorMessage"] }, { kind: "pipe", type: i3.LowerCasePipe, name: "lowercase" }, { kind: "pipe", type: i3.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i3.DatePipe, name: "date" }] });
6547
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: MarkUnsolicitedPaymentComponent, deps: [{ token: i1$1.FormBuilder }, { token: PaymentViewService }, { token: 'PAYMENT_LIB' }, { token: BulkScaningPaymentService }], target: i0.ɵɵFactoryTarget.Component });
6548
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: MarkUnsolicitedPaymentComponent, isStandalone: false, selector: "app-mark-unsolicited-payment", inputs: { caseType: "caseType" }, ngImport: i0, template: "<div class=\"mkpay-unidentified\">\n <div *ngIf=\"viewStatus === 'mainForm'\">\n <ccpay-error-banner *ngIf=\"errorMessage.showError\" [errorMessage]=\"errorMessage\"></ccpay-error-banner>\n <h1 class=\"heading-large\">Mark payment as transferred</h1>\n <div class=\"govuk-grid-column-full govuk-!-padding-bottom-3\">\n <hr class=\"govuk-section-break govuk-section-break--visible\">\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\">Payment asset number (DCN)</td>\n <td class=\"govuk-table__header\" scope=\"col\">Banked date</td>\n <td class=\"govuk-table__header\" scope=\"col\">Amount</td>\n <td class=\"govuk-table__header\" scope=\"col\">Method</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell\">{{unassignedRecord.dcn_reference}}</td>\n <td class=\"govuk-table__cell\"> {{unassignedRecord.date_banked | date:'dd MMM yyyy'}}</td>\n <td class=\"govuk-table__cell\"> {{unassignedRecord.amount | currency :'GBP':'symbol':'1.2-2'}}</td>\n <td class=\"capitalize govuk-table__cell\"> {{trimUnderscore(unassignedRecord.payment_method) | lowercase}} </td>\n </tr>\n </tbody>\n </table>\n </div>\n \n <form [formGroup]=\"markPaymentUnsolicitedForm\" novalidate>\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='MARKTRANSFERRED'>\n <div class=\"govuk-form-group\">\n <label class=\"govuk-label custom-govuk-label custom-govuk-label\" for=\"reason\">\n Reason for payment being marked as transferred \n </label>\n <textarea class=\"form-control form-control-3-4\" [ngClass]=\"{'inline-error-class': reasonHasError || reasonMinHasError || reasonMaxHasError}\" name=\"reason\" id=\"reason\" rows=\"5\" formControlName=\"reason\">\n </textarea>\n <p class=\"inline-error-message\" *ngIf=\"isReasonEmpty || reasonHasError || reasonMinHasError || reasonMaxHasError\">\n <span *ngIf=\"isReasonEmpty\">Enter a reason for marking this payment as transferred.</span>\n <span *ngIf=\"reasonHasError\">Enter a valid reason</span>\n <span *ngIf=\"reasonMinHasError\">Reason should be at least 3 characters.</span>\n <span *ngIf=\"reasonMaxHasError\">Reason should be 255 characters or under.</span>\n </p>\n </div>\n <div class=\"govuk-form-group\">\n <label class=\"govuk-label custom-govuk-label\" for=\"responsibleOffice\">\n Receiving Site ID (Receiving court/Bulk centre site ID) \n </label>\n <select class=\"form-control short-input\" id=\"responsibleOffice\" formControlName=\"responsibleOffice\" (change)=\"selectchange($event)\">\n <option value=\"\" selected='selected'>Please select</option>\n <option *ngFor=\"let siteID of siteIDList;\" value=\"{{siteID.siteId}}\">{{siteID.siteName}} ({{siteID.siteId}})</option>\n </select>\n <p class=\"inline-error-message\" *ngIf=\"isResponsibleOfficeEmpty || responsibleOfficeHasError\">\n <span *ngIf=\"isResponsibleOfficeEmpty\">Please select Receiving Site ID</span>\n <span *ngIf=\"responsibleOfficeHasError\">Please select a valid Receiving Site ID</span>\n </p>\n </div>\n <div class=\"govuk-button--group\">\n <button type=\"submit\" [disabled]=\"isContinueButtondisabled\" class=\"button\" (click)=\"saveAndContinue()\">\n Confirm\n </button>\n <button type=\"button\" class=\"button govuk-button--secondary\" (click)=\"cancelMarkUnsolicitedPayments('cancel')\">\n Cancel\n </button>\n </div>\n </form>\n \n</div>\n <ng-container *ngIf=\"viewStatus === 'unsolicitedContinueConfirm'\">\n <ccpay-error-banner *ngIf=\"errorMessage.showError\" [errorMessage]=\"errorMessage\"></ccpay-error-banner>\n <div class=\"govuk-warning-text\">\n <span class=\"govuk-warning-text__icon\" aria-hidden=\"true\">!</span>\n <strong class=\"govuk-warning-text__text\">\n <span class=\"govuk-warning-text__assistive\">Warning</span>\n <h1 class=\"heading-small\"> Are you sure you want to mark this payment as transferred? </h1>\n </strong>\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='TRANSFERREDCONFIRMATION'>\n <div class=\"govuk-grid-column-full govuk-!-padding-bottom-3\">\n <hr class=\"govuk-section-break govuk-section-break--visible\">\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\">Reason</td>\n <td class=\"govuk-table__header\" scope=\"col\">Receiving site ID</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell\">{{reason}}</td>\n <td class=\"govuk-table__cell\">{{selectedSiteName}}</td>\n </tr>\n </tbody>\n </table>\n </div>\n\n </div>\n <div class=\"govuk-button--group\">\n <button type=\"submit\" class=\"button\" [disabled]=\"isConfirmButtondisabled\" (click)=\"confirmPayments()\">\n Confirm\n </button>\n <button type=\"button\" class=\"button govuk-button--secondary\" (click)=\"cancelMarkUnsolicitedPayments()\">\n Cancel\n </button>\n </div>\n </ng-container>\n <ng-container *ngIf=\"viewStatus === 'unsolicitedCancelConfirm'\">\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='CANCELTRANSFERRED'>\n <div class=\"govuk-warning-text\">\n <span class=\"govuk-warning-text__icon\" aria-hidden=\"true\">!</span>\n <strong class=\"govuk-warning-text__text\">\n <span class=\"govuk-warning-text__assistive\">Warning</span>\n Are you sure you want to cancel?\n </strong>\n </div>\n <div class=\"govuk-button--group\">\n <button type=\"submit\" class=\"button\" (click)=\"gotoCasetransationPage()\">\n Yes\n </button>\n <button type=\"button\" class=\"button govuk-button--secondary\" (click)=\"cancelMarkUnsolicitedPayments()\">\n No\n </button>\n </div>\n </ng-container>\n</div>", styles: [".mkpay-unidentified{margin:10px 0 20px}.mkpay-unidentified .govuk-button--secondary{margin-left:10px;background-color:#b3b8bdf2}.mkpay-unidentified .inline-error-class{outline:3px solid #a71414;outline-offset:0}.mkpay-unidentified .inline-error-message{color:#a71414;font-weight:700;margin-top:10px}.lowercase{text-transform:lowercase}.capitalize{text-transform:capitalize}.custom-govuk-label,.govuk-warning-text__text{font-size:19px}#responsibleOffice{color:#000;width:75%;font-weight:white}select option{background:#fff}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: ErrorBannerComponent, selector: "ccpay-error-banner", inputs: ["errorMessage"] }, { kind: "pipe", type: i3.LowerCasePipe, name: "lowercase" }, { kind: "pipe", type: i3.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i3.DatePipe, name: "date" }] });
6535
6549
  }
6536
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: MarkUnsolicitedPaymentComponent, decorators: [{
6550
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: MarkUnsolicitedPaymentComponent, decorators: [{
6537
6551
  type: Component,
6538
6552
  args: [{ selector: 'app-mark-unsolicited-payment', standalone: false, template: "<div class=\"mkpay-unidentified\">\n <div *ngIf=\"viewStatus === 'mainForm'\">\n <ccpay-error-banner *ngIf=\"errorMessage.showError\" [errorMessage]=\"errorMessage\"></ccpay-error-banner>\n <h1 class=\"heading-large\">Mark payment as transferred</h1>\n <div class=\"govuk-grid-column-full govuk-!-padding-bottom-3\">\n <hr class=\"govuk-section-break govuk-section-break--visible\">\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\">Payment asset number (DCN)</td>\n <td class=\"govuk-table__header\" scope=\"col\">Banked date</td>\n <td class=\"govuk-table__header\" scope=\"col\">Amount</td>\n <td class=\"govuk-table__header\" scope=\"col\">Method</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell\">{{unassignedRecord.dcn_reference}}</td>\n <td class=\"govuk-table__cell\"> {{unassignedRecord.date_banked | date:'dd MMM yyyy'}}</td>\n <td class=\"govuk-table__cell\"> {{unassignedRecord.amount | currency :'GBP':'symbol':'1.2-2'}}</td>\n <td class=\"capitalize govuk-table__cell\"> {{trimUnderscore(unassignedRecord.payment_method) | lowercase}} </td>\n </tr>\n </tbody>\n </table>\n </div>\n \n <form [formGroup]=\"markPaymentUnsolicitedForm\" novalidate>\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='MARKTRANSFERRED'>\n <div class=\"govuk-form-group\">\n <label class=\"govuk-label custom-govuk-label custom-govuk-label\" for=\"reason\">\n Reason for payment being marked as transferred \n </label>\n <textarea class=\"form-control form-control-3-4\" [ngClass]=\"{'inline-error-class': reasonHasError || reasonMinHasError || reasonMaxHasError}\" name=\"reason\" id=\"reason\" rows=\"5\" formControlName=\"reason\">\n </textarea>\n <p class=\"inline-error-message\" *ngIf=\"isReasonEmpty || reasonHasError || reasonMinHasError || reasonMaxHasError\">\n <span *ngIf=\"isReasonEmpty\">Enter a reason for marking this payment as transferred.</span>\n <span *ngIf=\"reasonHasError\">Enter a valid reason</span>\n <span *ngIf=\"reasonMinHasError\">Reason should be at least 3 characters.</span>\n <span *ngIf=\"reasonMaxHasError\">Reason should be 255 characters or under.</span>\n </p>\n </div>\n <div class=\"govuk-form-group\">\n <label class=\"govuk-label custom-govuk-label\" for=\"responsibleOffice\">\n Receiving Site ID (Receiving court/Bulk centre site ID) \n </label>\n <select class=\"form-control short-input\" id=\"responsibleOffice\" formControlName=\"responsibleOffice\" (change)=\"selectchange($event)\">\n <option value=\"\" selected='selected'>Please select</option>\n <option *ngFor=\"let siteID of siteIDList;\" value=\"{{siteID.siteId}}\">{{siteID.siteName}} ({{siteID.siteId}})</option>\n </select>\n <p class=\"inline-error-message\" *ngIf=\"isResponsibleOfficeEmpty || responsibleOfficeHasError\">\n <span *ngIf=\"isResponsibleOfficeEmpty\">Please select Receiving Site ID</span>\n <span *ngIf=\"responsibleOfficeHasError\">Please select a valid Receiving Site ID</span>\n </p>\n </div>\n <div class=\"govuk-button--group\">\n <button type=\"submit\" [disabled]=\"isContinueButtondisabled\" class=\"button\" (click)=\"saveAndContinue()\">\n Confirm\n </button>\n <button type=\"button\" class=\"button govuk-button--secondary\" (click)=\"cancelMarkUnsolicitedPayments('cancel')\">\n Cancel\n </button>\n </div>\n </form>\n \n</div>\n <ng-container *ngIf=\"viewStatus === 'unsolicitedContinueConfirm'\">\n <ccpay-error-banner *ngIf=\"errorMessage.showError\" [errorMessage]=\"errorMessage\"></ccpay-error-banner>\n <div class=\"govuk-warning-text\">\n <span class=\"govuk-warning-text__icon\" aria-hidden=\"true\">!</span>\n <strong class=\"govuk-warning-text__text\">\n <span class=\"govuk-warning-text__assistive\">Warning</span>\n <h1 class=\"heading-small\"> Are you sure you want to mark this payment as transferred? </h1>\n </strong>\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='TRANSFERREDCONFIRMATION'>\n <div class=\"govuk-grid-column-full govuk-!-padding-bottom-3\">\n <hr class=\"govuk-section-break govuk-section-break--visible\">\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\">Reason</td>\n <td class=\"govuk-table__header\" scope=\"col\">Receiving site ID</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell\">{{reason}}</td>\n <td class=\"govuk-table__cell\">{{selectedSiteName}}</td>\n </tr>\n </tbody>\n </table>\n </div>\n\n </div>\n <div class=\"govuk-button--group\">\n <button type=\"submit\" class=\"button\" [disabled]=\"isConfirmButtondisabled\" (click)=\"confirmPayments()\">\n Confirm\n </button>\n <button type=\"button\" class=\"button govuk-button--secondary\" (click)=\"cancelMarkUnsolicitedPayments()\">\n Cancel\n </button>\n </div>\n </ng-container>\n <ng-container *ngIf=\"viewStatus === 'unsolicitedCancelConfirm'\">\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='CANCELTRANSFERRED'>\n <div class=\"govuk-warning-text\">\n <span class=\"govuk-warning-text__icon\" aria-hidden=\"true\">!</span>\n <strong class=\"govuk-warning-text__text\">\n <span class=\"govuk-warning-text__assistive\">Warning</span>\n Are you sure you want to cancel?\n </strong>\n </div>\n <div class=\"govuk-button--group\">\n <button type=\"submit\" class=\"button\" (click)=\"gotoCasetransationPage()\">\n Yes\n </button>\n <button type=\"button\" class=\"button govuk-button--secondary\" (click)=\"cancelMarkUnsolicitedPayments()\">\n No\n </button>\n </div>\n </ng-container>\n</div>", styles: [".mkpay-unidentified{margin:10px 0 20px}.mkpay-unidentified .govuk-button--secondary{margin-left:10px;background-color:#b3b8bdf2}.mkpay-unidentified .inline-error-class{outline:3px solid #a71414;outline-offset:0}.mkpay-unidentified .inline-error-message{color:#a71414;font-weight:700;margin-top:10px}.lowercase{text-transform:lowercase}.capitalize{text-transform:capitalize}.custom-govuk-label,.govuk-warning-text__text{font-size:19px}#responsibleOffice{color:#000;width:75%;font-weight:white}select option{background:#fff}\n"] }]
6539
6553
  }], ctorParameters: () => [{ type: i1$1.FormBuilder }, { type: PaymentViewService }, { type: undefined, decorators: [{
@@ -6574,10 +6588,10 @@ class keyValuePipe {
6574
6588
  }
6575
6589
  return keys;
6576
6590
  }
6577
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: keyValuePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
6578
- static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.1", ngImport: i0, type: keyValuePipe, isStandalone: false, name: "keyValue" });
6591
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: keyValuePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
6592
+ static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.18", ngImport: i0, type: keyValuePipe, isStandalone: false, name: "keyValue" });
6579
6593
  }
6580
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: keyValuePipe, decorators: [{
6594
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: keyValuePipe, decorators: [{
6581
6595
  type: Pipe,
6582
6596
  args: [{
6583
6597
  name: 'keyValue',
@@ -6970,10 +6984,10 @@ class AllocatePaymentsComponent {
6970
6984
  this.paymentLibComponent.isTurnOff = this.isTurnOff;
6971
6985
  this.paymentLibComponent.viewName = 'fee-summary';
6972
6986
  }
6973
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: AllocatePaymentsComponent, deps: [{ token: ErrorHandlerService }, { token: CaseTransactionsService }, { token: i1$1.FormBuilder }, { token: PaymentViewService }, { token: 'PAYMENT_LIB' }, { token: BulkScaningPaymentService }, { token: OrderslistService }], target: i0.ɵɵFactoryTarget.Component });
6974
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.1", type: AllocatePaymentsComponent, isStandalone: false, selector: "app-allocate-payments", inputs: { isTurnOff: "isTurnOff", caseType: "caseType" }, outputs: { reasonEventEmitter: "reasonEventEmitter", explanationEventEmitter: "explanationEventEmitter" }, ngImport: i0, template: "<div class=\"allocate-payments\">\n <ng-container *ngIf=\"viewStatus === 'mainForm' && !isTurnOff\">\n\n <div class=\"govuk-breadcrumbs\">\n <ol class=\"govuk-breadcrumbs__list\">\n <li class=\"govuk-breadcrumbs__list-item\">\n <a (click)=\"gotoCasetransationPage()\" class=\"govuk-back-link govuk-label\">Back</a>\n </li>\n </ol>\n </div>\n\n <div class=\"paymentrequest\">\n <h1 class=\"govuk-heading-xl govuk-!-margin-top-3 govuk-!-margin-bottom-4\">Select payment request</h1>\n <p class=\"govuk-!-margin-top-5 casererf\">Case reference: {{ccdReference}}</p>\n </div>\n\n <div *ngFor=\"let orderRef of orderLevelFees; let i = index;\" class=\"multiple-choice unprocessed-payments--radio-button\">\n <input id=\"'orderfee'+i+''\"\n aria-label=\"orderLevelRecord\"\n name=\"orderLevelRecord\"\n\n (click)=\"OrderListSelectEvent(orderRef.orderRefId)\"\n type=\"radio\"\n value=\"{{orderRef.orderTotalFees}}\" />\n <label for=\"radio-inline-1\"> {{orderRef.orderTotalFees | currency :'GBP':'symbol':'1.2-2'}}({{orderRef.orderStatus}})</label>\n </div>\n\n <div class=\"paymentrequest\">\n <button [disabled]=\"isContinueButtondisabled\" type=\"submit\" (click)=\"redirectToOrderFeeSearchPage()\" class=\"button allbtb button--disabled govuk-!-margin-right-1\">\n Continue\n </button>\n </div>\n\n </ng-container>\n\n <div *ngIf=\"viewStatus==='mainForm' && isTurnOff\">\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='ALLOCATEPAYMENTS'>\n <div class=\"govuk-breadcrumbs\" *ngIf=\"paymentRef\">\n <ol class=\"govuk-breadcrumbs__list\">\n <li class=\"govuk-breadcrumbs__list-item\">\n <a href=\"#\" (click)=\"gotoSummaryPage($event)\" class=\"govuk-back-link\">Back</a>\n </li>\n </ol>\n </div>\n <div class=\"govuk-heading-section\">\n <h1 class=\"govuk-heading-xl\">Allocate payment to fee group</h1>\n <h2 class=\"govuk-heading-l\">Amount left to be allocated:\n {{ unAllocatedPayment.amount | currency:'GBP':'symbol-narrow':'1.2-2' }}</h2>\n </div>\n <div class=\"payment-group-section\" *ngFor=\"let paymentGroup of paymentGroups\">\n <h3 class=\"govuk-heading-m\">Group reference: {{paymentGroup.payment_group_reference}}</h3>\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\"></td>\n <td class=\"govuk-table__header\" scope=\"col\">Code</td>\n <td class=\"govuk-table__header\" scope=\"col\">Description</td>\n <td class=\"govuk-table__header\" scope=\"col\">Volume</td>\n <td class=\"govuk-table__header\" scope=\"col\">Fee amount</td>\n <td class=\"govuk-table__header\" scope=\"col\">Calculated amount</td>\n <td class=\"govuk-table__header\" scope=\"col\">Group amount outstanding</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\">\n <tr class=\"govuk-table__row\" *ngFor=\"let fee of paymentGroup.fees; let i = index;\">\n <td class=\"govuk-table__cell govuk-table__cell--col1 govuk-table__custom--col1\"\n [attr.rowspan]=\"paymentGroup.fees.length\" *ngIf=\"i==0\">\n <div class=\"multiple-choice\">\n <input id=\"unpaiedFee-{{i}}\" name=\"unassignedRecord\" type=\"radio\"\n (click)=\"selectedPaymentGroup(paymentGroup)\" />\n <label for=\"unpaiedFee-{{i}}\"></label>\n </div>\n </td>\n <td class=\"govuk-table__cell govuk-table__cell--col1\">{{fee.code}}</td>\n <td class=\"govuk-table__cell govuk-table__cell--col2\"> {{fee.description}} </td>\n <td class=\"govuk-table__cell govuk-table__cell--col3\"> {{fee.volume? fee.volume : '-'}} </td>\n <td class=\"govuk-table__cell govuk-table__cell--col4\">\n {{ fee.fee_amount | currency:'GBP':'symbol-narrow':'1.2-2' }} </td>\n <td class=\"govuk-table__cell govuk-table__cell--col5\">\n {{fee.calculated_amount | currency:'GBP':'symbol-narrow':'1.2-2' }} </td>\n <td class=\"govuk-table__cell govuk-table__cell--col6 govuk-table__custom--col6\"\n [attr.rowspan]=\"paymentGroup.fees.length\" *ngIf=\"i==0\">\n {{getGroupOutstandingAmount(paymentGroup) | currency:'GBP':'symbol-narrow':'1.2-2' }} </td>\n\n </tr>\n\n </tbody>\n <tbody class=\"govuk-table__body\" *ngIf=\"paymentGroup.fees.length==0\">\n <td class=\"govuk-table__cell\" colspan=\"6\">No payments recorded</td>\n </tbody>\n </table>\n </div>\n <div class=\"govuk-button-group-allocate\">\n <button type=\"button\" class=\"button govuk-!-margin-right-1\" [disabled]=\"isContinueButtondisabled\"\n (click)=\"saveAndContinue()\">\n Continue\n </button>\n <button type=\"button\" class=\"button govuk-button--secondary\" (click)=\"gotoCasetransationPage()\">\n Cancel\n </button>\n </div>\n </div>\n\n <ng-container *ngIf=\"(viewStatus === 'mainForm' && isTurnOff) || viewStatus === 'allocatePaymentConfirmation'\">\n <ccpay-error-banner *ngIf=\"errorMessage.showError\" [errorMessage]=\"errorMessage\"></ccpay-error-banner>\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='{{feedbackUrlLabel}}'>\n <h1 class=\"govuk-heading-xl\">Confirm allocation</h1>\n <h2 class=\"govuk-heading-l govuk-heading-l--custom\">\n Amount to be allocated: {{amountForAllocation | currency:'GBP':'symbol-narrow':'1.2-2'}}\n </h2>\n <div class=\"payment-group-section\" *ngIf=\"paymentGroup\">\n <h3 class=\"govuk-heading-m--custom\" *ngIf=\"isTurnOff\">Group reference: {{paymentGroup.payment_group_reference}}\n </h3>\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\">Code</td>\n <td class=\"govuk-table__header\" scope=\"col\">Description</td>\n <td class=\"govuk-table__header\" scope=\"col\">Volume</td>\n <td class=\"govuk-table__header\" scope=\"col\">Fee amount</td>\n <td class=\"govuk-table__header\" scope=\"col\">Calculated amount</td>\n <td class=\"govuk-table__header\" scope=\"col\">Amount Due</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\">\n <tr class=\"govuk-table__row\" *ngFor=\"let fee of paymentGroup.fees; let i = index;\">\n <td class=\"govuk-table__cell govuk-table__cell--col1\">{{fee.code}}</td>\n <td class=\"govuk-table__cell govuk-table__cell--col2\"> {{fee.description}} </td>\n <td class=\"govuk-table__cell govuk-table__cell--col3\"> {{fee.volume? fee.volume : '-'}} </td>\n <td class=\"govuk-table__cell govuk-table__cell--col4\">\n {{ fee.fee_amount | currency:'GBP':'symbol-narrow':'1.2-2' }} </td>\n <td class=\"govuk-table__cell govuk-table__cell--col5\">\n {{fee.calculated_amount | currency:'GBP':'symbol-narrow':'1.2-2'}} </td>\n <td class=\"govuk-table__cell govuk-table__cell--col6\" [attr.rowspan]=\"paymentGroup.fees.length\"\n *ngIf=\"i==0\"> {{afterFeeAllocateOutstanding | currency:'GBP':'symbol-narrow':'1.2-2'}} </td>\n </tr>\n </tbody>\n <tbody class=\"govuk-table__body\" *ngIf=\"paymentGroup.fees.length == 0\">\n <td class=\"govuk-table__cell\" colspan=\"6\">No payments recorded</td>\n </tbody>\n </table>\n </div>\n <div class=\"govuk-warning-text\" *ngIf=\"isRemainingAmountGtZero || isRemainingAmountLtZero || remainingAmount === 0\">\n <span class=\"govuk-warning-text__icon\" aria-hidden=\"true\">!</span>\n <strong class=\"govuk-warning-text__text govuk-warning-text__custom\">\n <span class=\"govuk-warning-text__assistive\">Warning</span>\n {{paymentSectionLabel.title}} {{ remainingAmount | currency:'GBP':'symbol-narrow':'1.2-2' }}\n </strong>\n </div>\n <div class=\"govuk-form-group\" *ngIf=\"isRemainingAmountGtZero || isRemainingAmountLtZero\">\n <div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"how-contacted-conditional-hint\">\n <span id=\"how-contacted-conditional-hint\" class=\"govuk-hint\"\n [ngClass]=\"{'inline-error-message': paymentReasonHasError}\">\n {{paymentSectionLabel.reason}}\n </span>\n <div\n [ngClass]=\"paymentReasonHasError ? 'govuk-radios govuk-radios--conditional form-group-error' : 'govuk-radios govuk-radios--conditional'\"\n data-module=\"govuk-radios\" *ngIf=\"isRemainingAmountGtZero\">\n <div class=\"govuk-radios__item\" *ngFor=\"let reason of reasonList.overPayment | keyValue\">\n <input class=\"govuk-radios__input\" id=\"{{reason.key}}\" name=\"paymentReason\" type=\"radio\"\n [value]=\"reason.key\" (input)=\"getReasonValue(reason.value)\"/>\n <label class=\"govuk-label govuk-radios__label govuk-font__custom\" for=\"how-contacted-conditional\">\n {{reason.value}}\n </label>\n </div>\n </div>\n <div\n [ngClass]=\"paymentReasonHasError ? 'govuk-radios govuk-radios--conditional form-group-error' : 'govuk-radios govuk-radios--conditional'\"\n data-module=\"govuk-radios\" *ngIf=\"isRemainingAmountLtZero\">\n <div class=\"govuk-radios__item\" *ngFor=\"let reason of reasonList.shortFall | keyValue\">\n <input class=\"govuk-radios__input\" id=\"{{reason.key}}\" name=\"paymentReason\" type=\"radio\"\n [value]=\"reason.key\" (input)=\"getReasonValue(reason.value)\"/>\n <label class=\"govuk-label govuk-radios__label govuk-font__custom\" for=\"how-contacted-conditional\">\n {{reason.value}}\n </label>\n </div>\n </div>\n </fieldset>\n </div>\n <div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"how-contacted-conditional-hint\">\n <span id=\"how-contacted-conditional-hint\" class=\"govuk-hint\"\n [ngClass]=\"{'inline-error-message': paymentExplanationHasError}\">\n Provide an explanatory note\n </span>\n <div\n [ngClass]=\"paymentExplanationHasError ? 'govuk-radios govuk-radios--conditional form-group-error' : 'govuk-radios govuk-radios--conditional'\"\n data-module=\"govuk-radios\" *ngIf=\"isRemainingAmountGtZero\">\n <div class=\"govuk-radios__item\" *ngFor=\"let explanation of explanationList.overPayment | keyValue\">\n <input class=\"govuk-radios__input\" id=\"{{explanation.key}}\" name=\"paymentExplanation\" type=\"radio\"\n [value]=\"explanation.key\" (input)=\"getExplanationValue(explanation.value)\"\n (click)=\"selectRadioButton(explanation.key, 'explanation')\"/>\n <label class=\"govuk-label govuk-radios__label govuk-font__custom\" for=\"how-contacted-conditional\">\n {{explanation.value}}\n </label>\n </div>\n </div>\n <div\n [ngClass]=\"paymentExplanationHasError ? 'govuk-radios govuk-radios--conditional form-group-error' : 'govuk-radios govuk-radios--conditional'\"\n data-module=\"govuk-radios\" *ngIf=\"isRemainingAmountLtZero\">\n <div class=\"govuk-radios__item\" *ngFor=\"let explanation of explanationList.shortFall | keyValue\">\n <input class=\"govuk-radios__input\" id=\"{{explanation.key}}\" name=\"paymentExplanation\" type=\"radio\"\n [value]=\"explanation.key\" (input)=\"getExplanationValue(explanation.value)\"\n (click)=\"selectRadioButton(explanation.key, 'explanation')\"/>\n <label class=\"govuk-label govuk-radios__label govuk-font__custom\" for=\"how-contacted-conditional\">\n {{explanation.value}}\n </label>\n </div>\n </div>\n </fieldset>\n </div>\n </div>\n\n <form [formGroup]=\"overUnderPaymentForm\" novalidate>\n <div\n [ngClass]=\"isMoreDetailsBoxHide ? 'govuk-radios__conditional govuk-radios__conditional--hidden' : isPaymentDetailsEmpty || isPaymentDetailsInvalid || paymentDetailsMinHasError || paymentDetailsMaxHasError ? 'govuk-radios__conditional inline-error-border' : 'govuk-radios__conditional'\"\n id=\"conditional-how-contacted-conditional-3\">\n <div class=\"govuk-form-group\">\n <span id=\"more-detail-hint\" class=\"govuk-hint govuk-font__custom\">\n Please enter details\n </span>\n <textarea class=\"govuk-textarea\"\n [ngClass]=\"{'inline-error-class': isPaymentDetailsEmpty || isPaymentDetailsInvalid || paymentDetailsMinHasError || paymentDetailsMaxHasError}\"\n id=\"moreDetails\" name=\"moreDetails\" rows=\"5\" formControlName=\"moreDetails\">\n </textarea>\n <p class=\"inline-error-message\"\n *ngIf=\"isPaymentDetailsEmpty || isPaymentDetailsInvalid || paymentDetailsMinHasError || paymentDetailsMaxHasError\">\n <span *ngIf=\"isPaymentDetailsEmpty\">Enter a explanation</span>\n <span *ngIf=\"isPaymentDetailsInvalid\">Enter a valid explanation</span>\n <span *ngIf=\"paymentDetailsMinHasError\">Explanation should be at least 3 characters.</span>\n <span *ngIf=\"paymentDetailsMaxHasError\">Explanation should be 255 characters or under.</span>\n </p>\n </div>\n </div>\n <div class=\"govuk-button--group\">\n <button type=\"submit\" [disabled]=\"isConfirmButtondisabled\"\n [ngClass]=\"isConfirmButtondisabled ? 'button button--disabled' : 'button'\"\n (click)=\"confirmAllocatePayement()\">\n Confirm\n </button>\n <button type=\"button\" class=\"button govuk-button--secondary\" (click)=\"cancelAllocatePayment($event)\">\n Cancel\n </button>\n </div>\n </form>\n </ng-container>\n</div>\n", styles: [".allocate-payments{margin:20px 0}.allocate-payments .govuk-table__cell--col1,.allocate-payments .govuk-table__cell--col3{width:10%}.allocate-payments .govuk-table__cell--col2,.allocate-payments .govuk-table__cell--col6{width:25%}.allocate-payments .govuk-table__cell--col4,.allocate-payments .govuk-table__cell--col5{width:15%}.allocate-payments .govuk-button-group-allocate{display:flex;justify-content:flex-start}.allocate-payments .govuk-button--secondary{margin-left:10px;background-color:#b3b8bdf2}.allocate-payments .govuk-custom-warning__message{font-size:30px;position:relative;top:12px;font-weight:700}.allocate-payments .govuk-warning-text-custom{margin-bottom:0!important;padding:10px 0 5px}.allocate-payments .govuk-table__custom--col1{padding-top:0;padding-bottom:20px;padding-left:15px}.allocate-payments .govuk-table__custom--col6{text-align:center}.allocate-payments .govuk-list__custom{padding-left:20px}.allocate-payments .govuk-warning-text__custom,.allocate-payments .govuk-list__custom,.allocate-payments .govuk-heading-m--custom,.allocate-payments .govuk-label--m,.allocate-payments .govuk-radios__item,.allocate-payments .govuk-hint,.allocate-payments .govuk-font__custom{font-size:19px}.allocate-payments .govuk-radios__conditional--hidden{display:none}.allocate-payments .form-group-error{border-left:5px solid #b10e1e;padding-left:15px}.allocate-payments .inline-error-class{outline:3px solid #a71414;outline-offset:0}.allocate-payments .inline-error-message{color:#a71414;font-weight:700;margin-top:10px}.allocate-payments .inline-error-border{border-color:#a71414}.allbtb{margin-top:2em}.govuk-back-link{font-size:1.5rem!important}.multiple-choice{font-size:19px}.casererf{align-self:flex-end;font-size:19px}.paymentrequest{display:flex;flex-direction:row;justify-content:space-between;width:960px}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: ErrorBannerComponent, selector: "ccpay-error-banner", inputs: ["errorMessage"] }, { kind: "pipe", type: i3.CurrencyPipe, name: "currency" }, { kind: "pipe", type: keyValuePipe, name: "keyValue" }] });
6987
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: AllocatePaymentsComponent, deps: [{ token: ErrorHandlerService }, { token: CaseTransactionsService }, { token: i1$1.FormBuilder }, { token: PaymentViewService }, { token: 'PAYMENT_LIB' }, { token: BulkScaningPaymentService }, { token: OrderslistService }], target: i0.ɵɵFactoryTarget.Component });
6988
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: AllocatePaymentsComponent, isStandalone: false, selector: "app-allocate-payments", inputs: { isTurnOff: "isTurnOff", caseType: "caseType" }, outputs: { reasonEventEmitter: "reasonEventEmitter", explanationEventEmitter: "explanationEventEmitter" }, ngImport: i0, template: "<div class=\"allocate-payments\">\n <ng-container *ngIf=\"viewStatus === 'mainForm' && !isTurnOff\">\n\n <div class=\"govuk-breadcrumbs\">\n <ol class=\"govuk-breadcrumbs__list\">\n <li class=\"govuk-breadcrumbs__list-item\">\n <a (click)=\"gotoCasetransationPage()\" class=\"govuk-back-link govuk-label\">Back</a>\n </li>\n </ol>\n </div>\n\n <div class=\"paymentrequest\">\n <h1 class=\"govuk-heading-xl govuk-!-margin-top-3 govuk-!-margin-bottom-4\">Select payment request</h1>\n <p class=\"govuk-!-margin-top-5 casererf\">Case reference: {{ccdReference}}</p>\n </div>\n\n <div *ngFor=\"let orderRef of orderLevelFees; let i = index;\" class=\"multiple-choice unprocessed-payments--radio-button\">\n <input id=\"'orderfee'+i+''\"\n aria-label=\"orderLevelRecord\"\n name=\"orderLevelRecord\"\n\n (click)=\"OrderListSelectEvent(orderRef.orderRefId)\"\n type=\"radio\"\n value=\"{{orderRef.orderTotalFees}}\" />\n <label for=\"radio-inline-1\"> {{orderRef.orderTotalFees | currency :'GBP':'symbol':'1.2-2'}}({{orderRef.orderStatus}})</label>\n </div>\n\n <div class=\"paymentrequest\">\n <button [disabled]=\"isContinueButtondisabled\" type=\"submit\" (click)=\"redirectToOrderFeeSearchPage()\" class=\"button allbtb button--disabled govuk-!-margin-right-1\">\n Continue\n </button>\n </div>\n\n </ng-container>\n\n <div *ngIf=\"viewStatus==='mainForm' && isTurnOff\">\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='ALLOCATEPAYMENTS'>\n <div class=\"govuk-breadcrumbs\" *ngIf=\"paymentRef\">\n <ol class=\"govuk-breadcrumbs__list\">\n <li class=\"govuk-breadcrumbs__list-item\">\n <a href=\"#\" (click)=\"gotoSummaryPage($event)\" class=\"govuk-back-link\">Back</a>\n </li>\n </ol>\n </div>\n <div class=\"govuk-heading-section\">\n <h1 class=\"govuk-heading-xl\">Allocate payment to fee group</h1>\n <h2 class=\"govuk-heading-l\">Amount left to be allocated:\n {{ unAllocatedPayment.amount | currency:'GBP':'symbol-narrow':'1.2-2' }}</h2>\n </div>\n <div class=\"payment-group-section\" *ngFor=\"let paymentGroup of paymentGroups\">\n <h3 class=\"govuk-heading-m\">Group reference: {{paymentGroup.payment_group_reference}}</h3>\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\"></td>\n <td class=\"govuk-table__header\" scope=\"col\">Code</td>\n <td class=\"govuk-table__header\" scope=\"col\">Description</td>\n <td class=\"govuk-table__header\" scope=\"col\">Volume</td>\n <td class=\"govuk-table__header\" scope=\"col\">Fee amount</td>\n <td class=\"govuk-table__header\" scope=\"col\">Calculated amount</td>\n <td class=\"govuk-table__header\" scope=\"col\">Group amount outstanding</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\">\n <tr class=\"govuk-table__row\" *ngFor=\"let fee of paymentGroup.fees; let i = index;\">\n <td class=\"govuk-table__cell govuk-table__cell--col1 govuk-table__custom--col1\"\n [attr.rowspan]=\"paymentGroup.fees.length\" *ngIf=\"i==0\">\n <div class=\"multiple-choice\">\n <input id=\"unpaiedFee-{{i}}\" name=\"unassignedRecord\" type=\"radio\"\n (click)=\"selectedPaymentGroup(paymentGroup)\" />\n <label for=\"unpaiedFee-{{i}}\"></label>\n </div>\n </td>\n <td class=\"govuk-table__cell govuk-table__cell--col1\">{{fee.code}}</td>\n <td class=\"govuk-table__cell govuk-table__cell--col2\"> {{fee.description}} </td>\n <td class=\"govuk-table__cell govuk-table__cell--col3\"> {{fee.volume? fee.volume : '-'}} </td>\n <td class=\"govuk-table__cell govuk-table__cell--col4\">\n {{ fee.fee_amount | currency:'GBP':'symbol-narrow':'1.2-2' }} </td>\n <td class=\"govuk-table__cell govuk-table__cell--col5\">\n {{fee.calculated_amount | currency:'GBP':'symbol-narrow':'1.2-2' }} </td>\n <td class=\"govuk-table__cell govuk-table__cell--col6 govuk-table__custom--col6\"\n [attr.rowspan]=\"paymentGroup.fees.length\" *ngIf=\"i==0\">\n {{getGroupOutstandingAmount(paymentGroup) | currency:'GBP':'symbol-narrow':'1.2-2' }} </td>\n\n </tr>\n\n </tbody>\n <tbody class=\"govuk-table__body\" *ngIf=\"paymentGroup.fees.length==0\">\n <td class=\"govuk-table__cell\" colspan=\"6\">No payments recorded</td>\n </tbody>\n </table>\n </div>\n <div class=\"govuk-button-group-allocate\">\n <button type=\"button\" class=\"button govuk-!-margin-right-1\" [disabled]=\"isContinueButtondisabled\"\n (click)=\"saveAndContinue()\">\n Continue\n </button>\n <button type=\"button\" class=\"button govuk-button--secondary\" (click)=\"gotoCasetransationPage()\">\n Cancel\n </button>\n </div>\n </div>\n\n <ng-container *ngIf=\"(viewStatus === 'mainForm' && isTurnOff) || viewStatus === 'allocatePaymentConfirmation'\">\n <ccpay-error-banner *ngIf=\"errorMessage.showError\" [errorMessage]=\"errorMessage\"></ccpay-error-banner>\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='{{feedbackUrlLabel}}'>\n <h1 class=\"govuk-heading-xl\">Confirm allocation</h1>\n <h2 class=\"govuk-heading-l govuk-heading-l--custom\">\n Amount to be allocated: {{amountForAllocation | currency:'GBP':'symbol-narrow':'1.2-2'}}\n </h2>\n <div class=\"payment-group-section\" *ngIf=\"paymentGroup\">\n <h3 class=\"govuk-heading-m--custom\" *ngIf=\"isTurnOff\">Group reference: {{paymentGroup.payment_group_reference}}\n </h3>\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\">Code</td>\n <td class=\"govuk-table__header\" scope=\"col\">Description</td>\n <td class=\"govuk-table__header\" scope=\"col\">Volume</td>\n <td class=\"govuk-table__header\" scope=\"col\">Fee amount</td>\n <td class=\"govuk-table__header\" scope=\"col\">Calculated amount</td>\n <td class=\"govuk-table__header\" scope=\"col\">Amount Due</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\">\n <tr class=\"govuk-table__row\" *ngFor=\"let fee of paymentGroup.fees; let i = index;\">\n <td class=\"govuk-table__cell govuk-table__cell--col1\">{{fee.code}}</td>\n <td class=\"govuk-table__cell govuk-table__cell--col2\"> {{fee.description}} </td>\n <td class=\"govuk-table__cell govuk-table__cell--col3\"> {{fee.volume? fee.volume : '-'}} </td>\n <td class=\"govuk-table__cell govuk-table__cell--col4\">\n {{ fee.fee_amount | currency:'GBP':'symbol-narrow':'1.2-2' }} </td>\n <td class=\"govuk-table__cell govuk-table__cell--col5\">\n {{fee.calculated_amount | currency:'GBP':'symbol-narrow':'1.2-2'}} </td>\n <td class=\"govuk-table__cell govuk-table__cell--col6\" [attr.rowspan]=\"paymentGroup.fees.length\"\n *ngIf=\"i==0\"> {{afterFeeAllocateOutstanding | currency:'GBP':'symbol-narrow':'1.2-2'}} </td>\n </tr>\n </tbody>\n <tbody class=\"govuk-table__body\" *ngIf=\"paymentGroup.fees.length == 0\">\n <td class=\"govuk-table__cell\" colspan=\"6\">No payments recorded</td>\n </tbody>\n </table>\n </div>\n <div class=\"govuk-warning-text\" *ngIf=\"isRemainingAmountGtZero || isRemainingAmountLtZero || remainingAmount === 0\">\n <span class=\"govuk-warning-text__icon\" aria-hidden=\"true\">!</span>\n <strong class=\"govuk-warning-text__text govuk-warning-text__custom\">\n <span class=\"govuk-warning-text__assistive\">Warning</span>\n {{paymentSectionLabel.title}} {{ remainingAmount | currency:'GBP':'symbol-narrow':'1.2-2' }}\n </strong>\n </div>\n <div class=\"govuk-form-group\" *ngIf=\"isRemainingAmountGtZero || isRemainingAmountLtZero\">\n <div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"how-contacted-conditional-hint\">\n <span id=\"how-contacted-conditional-hint\" class=\"govuk-hint\"\n [ngClass]=\"{'inline-error-message': paymentReasonHasError}\">\n {{paymentSectionLabel.reason}}\n </span>\n <div\n [ngClass]=\"paymentReasonHasError ? 'govuk-radios govuk-radios--conditional form-group-error' : 'govuk-radios govuk-radios--conditional'\"\n data-module=\"govuk-radios\" *ngIf=\"isRemainingAmountGtZero\">\n <div class=\"govuk-radios__item\" *ngFor=\"let reason of reasonList.overPayment | keyValue\">\n <input class=\"govuk-radios__input\" id=\"{{reason.key}}\" name=\"paymentReason\" type=\"radio\"\n [value]=\"reason.key\" (input)=\"getReasonValue(reason.value)\"/>\n <label class=\"govuk-label govuk-radios__label govuk-font__custom\" for=\"how-contacted-conditional\">\n {{reason.value}}\n </label>\n </div>\n </div>\n <div\n [ngClass]=\"paymentReasonHasError ? 'govuk-radios govuk-radios--conditional form-group-error' : 'govuk-radios govuk-radios--conditional'\"\n data-module=\"govuk-radios\" *ngIf=\"isRemainingAmountLtZero\">\n <div class=\"govuk-radios__item\" *ngFor=\"let reason of reasonList.shortFall | keyValue\">\n <input class=\"govuk-radios__input\" id=\"{{reason.key}}\" name=\"paymentReason\" type=\"radio\"\n [value]=\"reason.key\" (input)=\"getReasonValue(reason.value)\"/>\n <label class=\"govuk-label govuk-radios__label govuk-font__custom\" for=\"how-contacted-conditional\">\n {{reason.value}}\n </label>\n </div>\n </div>\n </fieldset>\n </div>\n <div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"how-contacted-conditional-hint\">\n <span id=\"how-contacted-conditional-hint\" class=\"govuk-hint\"\n [ngClass]=\"{'inline-error-message': paymentExplanationHasError}\">\n Provide an explanatory note\n </span>\n <div\n [ngClass]=\"paymentExplanationHasError ? 'govuk-radios govuk-radios--conditional form-group-error' : 'govuk-radios govuk-radios--conditional'\"\n data-module=\"govuk-radios\" *ngIf=\"isRemainingAmountGtZero\">\n <div class=\"govuk-radios__item\" *ngFor=\"let explanation of explanationList.overPayment | keyValue\">\n <input class=\"govuk-radios__input\" id=\"{{explanation.key}}\" name=\"paymentExplanation\" type=\"radio\"\n [value]=\"explanation.key\" (input)=\"getExplanationValue(explanation.value)\"\n (click)=\"selectRadioButton(explanation.key, 'explanation')\"/>\n <label class=\"govuk-label govuk-radios__label govuk-font__custom\" for=\"how-contacted-conditional\">\n {{explanation.value}}\n </label>\n </div>\n </div>\n <div\n [ngClass]=\"paymentExplanationHasError ? 'govuk-radios govuk-radios--conditional form-group-error' : 'govuk-radios govuk-radios--conditional'\"\n data-module=\"govuk-radios\" *ngIf=\"isRemainingAmountLtZero\">\n <div class=\"govuk-radios__item\" *ngFor=\"let explanation of explanationList.shortFall | keyValue\">\n <input class=\"govuk-radios__input\" id=\"{{explanation.key}}\" name=\"paymentExplanation\" type=\"radio\"\n [value]=\"explanation.key\" (input)=\"getExplanationValue(explanation.value)\"\n (click)=\"selectRadioButton(explanation.key, 'explanation')\"/>\n <label class=\"govuk-label govuk-radios__label govuk-font__custom\" for=\"how-contacted-conditional\">\n {{explanation.value}}\n </label>\n </div>\n </div>\n </fieldset>\n </div>\n </div>\n\n <form [formGroup]=\"overUnderPaymentForm\" novalidate>\n <div\n [ngClass]=\"isMoreDetailsBoxHide ? 'govuk-radios__conditional govuk-radios__conditional--hidden' : isPaymentDetailsEmpty || isPaymentDetailsInvalid || paymentDetailsMinHasError || paymentDetailsMaxHasError ? 'govuk-radios__conditional inline-error-border' : 'govuk-radios__conditional'\"\n id=\"conditional-how-contacted-conditional-3\">\n <div class=\"govuk-form-group\">\n <span id=\"more-detail-hint\" class=\"govuk-hint govuk-font__custom\">\n Please enter details\n </span>\n <textarea class=\"govuk-textarea\"\n [ngClass]=\"{'inline-error-class': isPaymentDetailsEmpty || isPaymentDetailsInvalid || paymentDetailsMinHasError || paymentDetailsMaxHasError}\"\n id=\"moreDetails\" name=\"moreDetails\" rows=\"5\" formControlName=\"moreDetails\">\n </textarea>\n <p class=\"inline-error-message\"\n *ngIf=\"isPaymentDetailsEmpty || isPaymentDetailsInvalid || paymentDetailsMinHasError || paymentDetailsMaxHasError\">\n <span *ngIf=\"isPaymentDetailsEmpty\">Enter a explanation</span>\n <span *ngIf=\"isPaymentDetailsInvalid\">Enter a valid explanation</span>\n <span *ngIf=\"paymentDetailsMinHasError\">Explanation should be at least 3 characters.</span>\n <span *ngIf=\"paymentDetailsMaxHasError\">Explanation should be 255 characters or under.</span>\n </p>\n </div>\n </div>\n <div class=\"govuk-button--group\">\n <button type=\"submit\" [disabled]=\"isConfirmButtondisabled\"\n [ngClass]=\"isConfirmButtondisabled ? 'button button--disabled' : 'button'\"\n (click)=\"confirmAllocatePayement()\">\n Confirm\n </button>\n <button type=\"button\" class=\"button govuk-button--secondary\" (click)=\"cancelAllocatePayment($event)\">\n Cancel\n </button>\n </div>\n </form>\n </ng-container>\n</div>\n", styles: [".allocate-payments{margin:20px 0}.allocate-payments .govuk-table__cell--col1,.allocate-payments .govuk-table__cell--col3{width:10%}.allocate-payments .govuk-table__cell--col2,.allocate-payments .govuk-table__cell--col6{width:25%}.allocate-payments .govuk-table__cell--col4,.allocate-payments .govuk-table__cell--col5{width:15%}.allocate-payments .govuk-button-group-allocate{display:flex;justify-content:flex-start}.allocate-payments .govuk-button--secondary{margin-left:10px;background-color:#b3b8bdf2}.allocate-payments .govuk-custom-warning__message{font-size:30px;position:relative;top:12px;font-weight:700}.allocate-payments .govuk-warning-text-custom{margin-bottom:0!important;padding:10px 0 5px}.allocate-payments .govuk-table__custom--col1{padding-top:0;padding-bottom:20px;padding-left:15px}.allocate-payments .govuk-table__custom--col6{text-align:center}.allocate-payments .govuk-list__custom{padding-left:20px}.allocate-payments .govuk-warning-text__custom,.allocate-payments .govuk-list__custom,.allocate-payments .govuk-heading-m--custom,.allocate-payments .govuk-label--m,.allocate-payments .govuk-radios__item,.allocate-payments .govuk-hint,.allocate-payments .govuk-font__custom{font-size:19px}.allocate-payments .govuk-radios__conditional--hidden{display:none}.allocate-payments .form-group-error{border-left:5px solid #b10e1e;padding-left:15px}.allocate-payments .inline-error-class{outline:3px solid #a71414;outline-offset:0}.allocate-payments .inline-error-message{color:#a71414;font-weight:700;margin-top:10px}.allocate-payments .inline-error-border{border-color:#a71414}.allbtb{margin-top:2em}.govuk-back-link{font-size:1.5rem!important}.multiple-choice{font-size:19px}.casererf{align-self:flex-end;font-size:19px}.paymentrequest{display:flex;flex-direction:row;justify-content:space-between;width:960px}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: ErrorBannerComponent, selector: "ccpay-error-banner", inputs: ["errorMessage"] }, { kind: "pipe", type: i3.CurrencyPipe, name: "currency" }, { kind: "pipe", type: keyValuePipe, name: "keyValue" }] });
6975
6989
  }
6976
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: AllocatePaymentsComponent, decorators: [{
6990
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: AllocatePaymentsComponent, decorators: [{
6977
6991
  type: Component,
6978
6992
  args: [{ selector: 'app-allocate-payments', standalone: false, template: "<div class=\"allocate-payments\">\n <ng-container *ngIf=\"viewStatus === 'mainForm' && !isTurnOff\">\n\n <div class=\"govuk-breadcrumbs\">\n <ol class=\"govuk-breadcrumbs__list\">\n <li class=\"govuk-breadcrumbs__list-item\">\n <a (click)=\"gotoCasetransationPage()\" class=\"govuk-back-link govuk-label\">Back</a>\n </li>\n </ol>\n </div>\n\n <div class=\"paymentrequest\">\n <h1 class=\"govuk-heading-xl govuk-!-margin-top-3 govuk-!-margin-bottom-4\">Select payment request</h1>\n <p class=\"govuk-!-margin-top-5 casererf\">Case reference: {{ccdReference}}</p>\n </div>\n\n <div *ngFor=\"let orderRef of orderLevelFees; let i = index;\" class=\"multiple-choice unprocessed-payments--radio-button\">\n <input id=\"'orderfee'+i+''\"\n aria-label=\"orderLevelRecord\"\n name=\"orderLevelRecord\"\n\n (click)=\"OrderListSelectEvent(orderRef.orderRefId)\"\n type=\"radio\"\n value=\"{{orderRef.orderTotalFees}}\" />\n <label for=\"radio-inline-1\"> {{orderRef.orderTotalFees | currency :'GBP':'symbol':'1.2-2'}}({{orderRef.orderStatus}})</label>\n </div>\n\n <div class=\"paymentrequest\">\n <button [disabled]=\"isContinueButtondisabled\" type=\"submit\" (click)=\"redirectToOrderFeeSearchPage()\" class=\"button allbtb button--disabled govuk-!-margin-right-1\">\n Continue\n </button>\n </div>\n\n </ng-container>\n\n <div *ngIf=\"viewStatus==='mainForm' && isTurnOff\">\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='ALLOCATEPAYMENTS'>\n <div class=\"govuk-breadcrumbs\" *ngIf=\"paymentRef\">\n <ol class=\"govuk-breadcrumbs__list\">\n <li class=\"govuk-breadcrumbs__list-item\">\n <a href=\"#\" (click)=\"gotoSummaryPage($event)\" class=\"govuk-back-link\">Back</a>\n </li>\n </ol>\n </div>\n <div class=\"govuk-heading-section\">\n <h1 class=\"govuk-heading-xl\">Allocate payment to fee group</h1>\n <h2 class=\"govuk-heading-l\">Amount left to be allocated:\n {{ unAllocatedPayment.amount | currency:'GBP':'symbol-narrow':'1.2-2' }}</h2>\n </div>\n <div class=\"payment-group-section\" *ngFor=\"let paymentGroup of paymentGroups\">\n <h3 class=\"govuk-heading-m\">Group reference: {{paymentGroup.payment_group_reference}}</h3>\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\"></td>\n <td class=\"govuk-table__header\" scope=\"col\">Code</td>\n <td class=\"govuk-table__header\" scope=\"col\">Description</td>\n <td class=\"govuk-table__header\" scope=\"col\">Volume</td>\n <td class=\"govuk-table__header\" scope=\"col\">Fee amount</td>\n <td class=\"govuk-table__header\" scope=\"col\">Calculated amount</td>\n <td class=\"govuk-table__header\" scope=\"col\">Group amount outstanding</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\">\n <tr class=\"govuk-table__row\" *ngFor=\"let fee of paymentGroup.fees; let i = index;\">\n <td class=\"govuk-table__cell govuk-table__cell--col1 govuk-table__custom--col1\"\n [attr.rowspan]=\"paymentGroup.fees.length\" *ngIf=\"i==0\">\n <div class=\"multiple-choice\">\n <input id=\"unpaiedFee-{{i}}\" name=\"unassignedRecord\" type=\"radio\"\n (click)=\"selectedPaymentGroup(paymentGroup)\" />\n <label for=\"unpaiedFee-{{i}}\"></label>\n </div>\n </td>\n <td class=\"govuk-table__cell govuk-table__cell--col1\">{{fee.code}}</td>\n <td class=\"govuk-table__cell govuk-table__cell--col2\"> {{fee.description}} </td>\n <td class=\"govuk-table__cell govuk-table__cell--col3\"> {{fee.volume? fee.volume : '-'}} </td>\n <td class=\"govuk-table__cell govuk-table__cell--col4\">\n {{ fee.fee_amount | currency:'GBP':'symbol-narrow':'1.2-2' }} </td>\n <td class=\"govuk-table__cell govuk-table__cell--col5\">\n {{fee.calculated_amount | currency:'GBP':'symbol-narrow':'1.2-2' }} </td>\n <td class=\"govuk-table__cell govuk-table__cell--col6 govuk-table__custom--col6\"\n [attr.rowspan]=\"paymentGroup.fees.length\" *ngIf=\"i==0\">\n {{getGroupOutstandingAmount(paymentGroup) | currency:'GBP':'symbol-narrow':'1.2-2' }} </td>\n\n </tr>\n\n </tbody>\n <tbody class=\"govuk-table__body\" *ngIf=\"paymentGroup.fees.length==0\">\n <td class=\"govuk-table__cell\" colspan=\"6\">No payments recorded</td>\n </tbody>\n </table>\n </div>\n <div class=\"govuk-button-group-allocate\">\n <button type=\"button\" class=\"button govuk-!-margin-right-1\" [disabled]=\"isContinueButtondisabled\"\n (click)=\"saveAndContinue()\">\n Continue\n </button>\n <button type=\"button\" class=\"button govuk-button--secondary\" (click)=\"gotoCasetransationPage()\">\n Cancel\n </button>\n </div>\n </div>\n\n <ng-container *ngIf=\"(viewStatus === 'mainForm' && isTurnOff) || viewStatus === 'allocatePaymentConfirmation'\">\n <ccpay-error-banner *ngIf=\"errorMessage.showError\" [errorMessage]=\"errorMessage\"></ccpay-error-banner>\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='{{feedbackUrlLabel}}'>\n <h1 class=\"govuk-heading-xl\">Confirm allocation</h1>\n <h2 class=\"govuk-heading-l govuk-heading-l--custom\">\n Amount to be allocated: {{amountForAllocation | currency:'GBP':'symbol-narrow':'1.2-2'}}\n </h2>\n <div class=\"payment-group-section\" *ngIf=\"paymentGroup\">\n <h3 class=\"govuk-heading-m--custom\" *ngIf=\"isTurnOff\">Group reference: {{paymentGroup.payment_group_reference}}\n </h3>\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\">Code</td>\n <td class=\"govuk-table__header\" scope=\"col\">Description</td>\n <td class=\"govuk-table__header\" scope=\"col\">Volume</td>\n <td class=\"govuk-table__header\" scope=\"col\">Fee amount</td>\n <td class=\"govuk-table__header\" scope=\"col\">Calculated amount</td>\n <td class=\"govuk-table__header\" scope=\"col\">Amount Due</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\">\n <tr class=\"govuk-table__row\" *ngFor=\"let fee of paymentGroup.fees; let i = index;\">\n <td class=\"govuk-table__cell govuk-table__cell--col1\">{{fee.code}}</td>\n <td class=\"govuk-table__cell govuk-table__cell--col2\"> {{fee.description}} </td>\n <td class=\"govuk-table__cell govuk-table__cell--col3\"> {{fee.volume? fee.volume : '-'}} </td>\n <td class=\"govuk-table__cell govuk-table__cell--col4\">\n {{ fee.fee_amount | currency:'GBP':'symbol-narrow':'1.2-2' }} </td>\n <td class=\"govuk-table__cell govuk-table__cell--col5\">\n {{fee.calculated_amount | currency:'GBP':'symbol-narrow':'1.2-2'}} </td>\n <td class=\"govuk-table__cell govuk-table__cell--col6\" [attr.rowspan]=\"paymentGroup.fees.length\"\n *ngIf=\"i==0\"> {{afterFeeAllocateOutstanding | currency:'GBP':'symbol-narrow':'1.2-2'}} </td>\n </tr>\n </tbody>\n <tbody class=\"govuk-table__body\" *ngIf=\"paymentGroup.fees.length == 0\">\n <td class=\"govuk-table__cell\" colspan=\"6\">No payments recorded</td>\n </tbody>\n </table>\n </div>\n <div class=\"govuk-warning-text\" *ngIf=\"isRemainingAmountGtZero || isRemainingAmountLtZero || remainingAmount === 0\">\n <span class=\"govuk-warning-text__icon\" aria-hidden=\"true\">!</span>\n <strong class=\"govuk-warning-text__text govuk-warning-text__custom\">\n <span class=\"govuk-warning-text__assistive\">Warning</span>\n {{paymentSectionLabel.title}} {{ remainingAmount | currency:'GBP':'symbol-narrow':'1.2-2' }}\n </strong>\n </div>\n <div class=\"govuk-form-group\" *ngIf=\"isRemainingAmountGtZero || isRemainingAmountLtZero\">\n <div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"how-contacted-conditional-hint\">\n <span id=\"how-contacted-conditional-hint\" class=\"govuk-hint\"\n [ngClass]=\"{'inline-error-message': paymentReasonHasError}\">\n {{paymentSectionLabel.reason}}\n </span>\n <div\n [ngClass]=\"paymentReasonHasError ? 'govuk-radios govuk-radios--conditional form-group-error' : 'govuk-radios govuk-radios--conditional'\"\n data-module=\"govuk-radios\" *ngIf=\"isRemainingAmountGtZero\">\n <div class=\"govuk-radios__item\" *ngFor=\"let reason of reasonList.overPayment | keyValue\">\n <input class=\"govuk-radios__input\" id=\"{{reason.key}}\" name=\"paymentReason\" type=\"radio\"\n [value]=\"reason.key\" (input)=\"getReasonValue(reason.value)\"/>\n <label class=\"govuk-label govuk-radios__label govuk-font__custom\" for=\"how-contacted-conditional\">\n {{reason.value}}\n </label>\n </div>\n </div>\n <div\n [ngClass]=\"paymentReasonHasError ? 'govuk-radios govuk-radios--conditional form-group-error' : 'govuk-radios govuk-radios--conditional'\"\n data-module=\"govuk-radios\" *ngIf=\"isRemainingAmountLtZero\">\n <div class=\"govuk-radios__item\" *ngFor=\"let reason of reasonList.shortFall | keyValue\">\n <input class=\"govuk-radios__input\" id=\"{{reason.key}}\" name=\"paymentReason\" type=\"radio\"\n [value]=\"reason.key\" (input)=\"getReasonValue(reason.value)\"/>\n <label class=\"govuk-label govuk-radios__label govuk-font__custom\" for=\"how-contacted-conditional\">\n {{reason.value}}\n </label>\n </div>\n </div>\n </fieldset>\n </div>\n <div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"how-contacted-conditional-hint\">\n <span id=\"how-contacted-conditional-hint\" class=\"govuk-hint\"\n [ngClass]=\"{'inline-error-message': paymentExplanationHasError}\">\n Provide an explanatory note\n </span>\n <div\n [ngClass]=\"paymentExplanationHasError ? 'govuk-radios govuk-radios--conditional form-group-error' : 'govuk-radios govuk-radios--conditional'\"\n data-module=\"govuk-radios\" *ngIf=\"isRemainingAmountGtZero\">\n <div class=\"govuk-radios__item\" *ngFor=\"let explanation of explanationList.overPayment | keyValue\">\n <input class=\"govuk-radios__input\" id=\"{{explanation.key}}\" name=\"paymentExplanation\" type=\"radio\"\n [value]=\"explanation.key\" (input)=\"getExplanationValue(explanation.value)\"\n (click)=\"selectRadioButton(explanation.key, 'explanation')\"/>\n <label class=\"govuk-label govuk-radios__label govuk-font__custom\" for=\"how-contacted-conditional\">\n {{explanation.value}}\n </label>\n </div>\n </div>\n <div\n [ngClass]=\"paymentExplanationHasError ? 'govuk-radios govuk-radios--conditional form-group-error' : 'govuk-radios govuk-radios--conditional'\"\n data-module=\"govuk-radios\" *ngIf=\"isRemainingAmountLtZero\">\n <div class=\"govuk-radios__item\" *ngFor=\"let explanation of explanationList.shortFall | keyValue\">\n <input class=\"govuk-radios__input\" id=\"{{explanation.key}}\" name=\"paymentExplanation\" type=\"radio\"\n [value]=\"explanation.key\" (input)=\"getExplanationValue(explanation.value)\"\n (click)=\"selectRadioButton(explanation.key, 'explanation')\"/>\n <label class=\"govuk-label govuk-radios__label govuk-font__custom\" for=\"how-contacted-conditional\">\n {{explanation.value}}\n </label>\n </div>\n </div>\n </fieldset>\n </div>\n </div>\n\n <form [formGroup]=\"overUnderPaymentForm\" novalidate>\n <div\n [ngClass]=\"isMoreDetailsBoxHide ? 'govuk-radios__conditional govuk-radios__conditional--hidden' : isPaymentDetailsEmpty || isPaymentDetailsInvalid || paymentDetailsMinHasError || paymentDetailsMaxHasError ? 'govuk-radios__conditional inline-error-border' : 'govuk-radios__conditional'\"\n id=\"conditional-how-contacted-conditional-3\">\n <div class=\"govuk-form-group\">\n <span id=\"more-detail-hint\" class=\"govuk-hint govuk-font__custom\">\n Please enter details\n </span>\n <textarea class=\"govuk-textarea\"\n [ngClass]=\"{'inline-error-class': isPaymentDetailsEmpty || isPaymentDetailsInvalid || paymentDetailsMinHasError || paymentDetailsMaxHasError}\"\n id=\"moreDetails\" name=\"moreDetails\" rows=\"5\" formControlName=\"moreDetails\">\n </textarea>\n <p class=\"inline-error-message\"\n *ngIf=\"isPaymentDetailsEmpty || isPaymentDetailsInvalid || paymentDetailsMinHasError || paymentDetailsMaxHasError\">\n <span *ngIf=\"isPaymentDetailsEmpty\">Enter a explanation</span>\n <span *ngIf=\"isPaymentDetailsInvalid\">Enter a valid explanation</span>\n <span *ngIf=\"paymentDetailsMinHasError\">Explanation should be at least 3 characters.</span>\n <span *ngIf=\"paymentDetailsMaxHasError\">Explanation should be 255 characters or under.</span>\n </p>\n </div>\n </div>\n <div class=\"govuk-button--group\">\n <button type=\"submit\" [disabled]=\"isConfirmButtondisabled\"\n [ngClass]=\"isConfirmButtondisabled ? 'button button--disabled' : 'button'\"\n (click)=\"confirmAllocatePayement()\">\n Confirm\n </button>\n <button type=\"button\" class=\"button govuk-button--secondary\" (click)=\"cancelAllocatePayment($event)\">\n Cancel\n </button>\n </div>\n </form>\n </ng-container>\n</div>\n", styles: [".allocate-payments{margin:20px 0}.allocate-payments .govuk-table__cell--col1,.allocate-payments .govuk-table__cell--col3{width:10%}.allocate-payments .govuk-table__cell--col2,.allocate-payments .govuk-table__cell--col6{width:25%}.allocate-payments .govuk-table__cell--col4,.allocate-payments .govuk-table__cell--col5{width:15%}.allocate-payments .govuk-button-group-allocate{display:flex;justify-content:flex-start}.allocate-payments .govuk-button--secondary{margin-left:10px;background-color:#b3b8bdf2}.allocate-payments .govuk-custom-warning__message{font-size:30px;position:relative;top:12px;font-weight:700}.allocate-payments .govuk-warning-text-custom{margin-bottom:0!important;padding:10px 0 5px}.allocate-payments .govuk-table__custom--col1{padding-top:0;padding-bottom:20px;padding-left:15px}.allocate-payments .govuk-table__custom--col6{text-align:center}.allocate-payments .govuk-list__custom{padding-left:20px}.allocate-payments .govuk-warning-text__custom,.allocate-payments .govuk-list__custom,.allocate-payments .govuk-heading-m--custom,.allocate-payments .govuk-label--m,.allocate-payments .govuk-radios__item,.allocate-payments .govuk-hint,.allocate-payments .govuk-font__custom{font-size:19px}.allocate-payments .govuk-radios__conditional--hidden{display:none}.allocate-payments .form-group-error{border-left:5px solid #b10e1e;padding-left:15px}.allocate-payments .inline-error-class{outline:3px solid #a71414;outline-offset:0}.allocate-payments .inline-error-message{color:#a71414;font-weight:700;margin-top:10px}.allocate-payments .inline-error-border{border-color:#a71414}.allbtb{margin-top:2em}.govuk-back-link{font-size:1.5rem!important}.multiple-choice{font-size:19px}.casererf{align-self:flex-end;font-size:19px}.paymentrequest{display:flex;flex-direction:row;justify-content:space-between;width:960px}\n"] }]
6979
6993
  }], ctorParameters: () => [{ type: ErrorHandlerService }, { type: CaseTransactionsService }, { type: i1$1.FormBuilder }, { type: PaymentViewService }, { type: undefined, decorators: [{
@@ -7000,7 +7014,7 @@ class PaymentToPayhubRequest {
7000
7014
  telephony_system;
7001
7015
  constructor(ccd_case_number, amount, caseType, telephony_system) {
7002
7016
  this.ccd_case_number = ccd_case_number;
7003
- this.amount = amount.toFixed(2);
7017
+ this.amount = Number(amount.toFixed(2));
7004
7018
  this.case_type = caseType;
7005
7019
  this.telephony_system = telephony_system;
7006
7020
  }
@@ -7014,7 +7028,7 @@ class TelephonyToPayhubRequest {
7014
7028
  telephony_system;
7015
7029
  constructor(ccd_case_number, amount, caseType, telephony_system) {
7016
7030
  this.ccd_case_number = ccd_case_number;
7017
- this.amount = amount.toFixed(2);
7031
+ this.amount = Number(amount.toFixed(2));
7018
7032
  this.case_type = caseType;
7019
7033
  this.telephony_system = telephony_system;
7020
7034
  }
@@ -7261,10 +7275,10 @@ class FeeSummaryComponent {
7261
7275
  this.telephonySelectionEnable = false;
7262
7276
  }
7263
7277
  }
7264
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: FeeSummaryComponent, deps: [{ token: i1$2.Router }, { token: BulkScaningPaymentService }, { token: i3.Location }, { token: PaymentViewService }, { token: 'PAYMENT_LIB' }, { token: OrderslistService }], target: i0.ɵɵFactoryTarget.Component });
7265
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.1", type: FeeSummaryComponent, isStandalone: false, selector: "ccpay-fee-summary", inputs: { paymentGroupRef: "paymentGroupRef", ccdCaseNumber: "ccdCaseNumber", isTurnOff: "isTurnOff", caseType: "caseType", telephonySelectionEnable: "telephonySelectionEnable" }, ngImport: i0, template: "\n<div class=\"govuk-breadcrumbs\" *ngIf=\"isBackButtonEnable\">\n <ol class=\"govuk-breadcrumbs__list\">\n <li class=\"govuk-breadcrumbs__list-item\" *ngIf=\"!isTurnOff\">\n <a (click)=\"loadCaseTransactionPage()\" class=\"govuk-back-link govuk-label\">Back</a>\n </li>\n <li class=\"govuk-breadcrumbs__list-item\" *ngIf=\"isTurnOff\">\n <a (click)=\"redirectToFeeSearchPage($event,'summary')\" class=\"govuk-back-link govuk-label\">Back</a>\n </li>\n </ol>\n</div>\n<div class=\"fee-summary\" *ngIf=\"viewStatus === 'main'\">\n <main class=\"govuk-main-wrapper\">\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='FEESUMMARY'>\n <div class=\"summaryheader\">\n <h1 class=\"heading-large govuk-!-margin-top-3 govuk-!-margin-bottom-4\">Summary</h1>\n <p class=\"govuk-!-margin-top-5 caseref\">Case reference:{{ccdCaseNumber | ccdHyphens}}</p>\n </div>\n\n <!-- <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n <h1 class=\"heading-xlarge\">Fee Summary</h1>\n </div>\n\n\n \u00A0<div\u00A0class=\"govuk-grid-column-one-third\"\u00A0align=\"right\">\n \u00A0\u00A0\u00A0\u00A0\u00A0\u00A0<button\u00A0 *ngIf=\"!isTurnOff\" (click)=\"redirectToFeeSearchPage($event,'summary')\"\n \u00A0\u00A0\u00A0\u00A0\u00A0\u00A0[disabled]=\"isPaymentExist\"\n \u00A0\u00A0\u00A0\u00A0\u00A0\u00A0[ngClass]='isPaymentExist ?\u00A0\"button\u00A0button--disabled govuk-!-margin-right-1\"\u00A0:\u00A0\"button govuk-!-margin-right-1\"'>\n Add a new fee\n </button>\n\n <a *ngIf=\"isTurnOff\" (click)=\"redirectToFeeSearchPage($event,'summary')\" class=\"button\">Add a new fee</a>\n </div>\n </div> -->\n\n\n\n\n\n <div *ngIf=\"errorMessage\">\n <div class=\"error-summary\" role=\"group\" aria-labelledby=\"failure-error-summary-heading\" tabindex=\"-1\">\n <h2 class=\"heading-medium error-summary-heading\" id=\"failure-error-summary-heading\">\n An error has occurred on the Fee summary page.\n </h2>\n <div class=\"govuk-error-summary__body\">\n {{ errorMessage }}\n </div>\n </div>\n </div>\n\n <div class=\"govuk-!-margin-top-3\">\n <table class=\"govuk-table govuk-!-margin-bottom-2\" *ngIf=\"paymentGroup\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <th class=\"govuk-table__header\" scope=\"col\" class=\"class600\">Description</th>\n <th class=\"govuk-table__header\" scope=\"col\" class=\"class60\">Quantity</th>\n <th class=\"govuk-table__header\" scope=\"col\" class=\"class80\"></th>\n <th class=\"govuk-table__header\" scope=\"col\" class=\"class100\">Amount</th>\n </tr>\n </thead>\n\n <tbody class=\"govuk-table__body\" *ngIf=\"paymentGroup.fees\">\n <ng-container *ngFor=\"let fee of paymentGroup.fees; let i = index;\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell\">{{ fee.description }}\n <span class=\"no-border\" *ngIf=\"(isPaymentExist || (getRemissionByFeeCode(fee.code)?.hwf_amount === 0 || !getRemissionByFeeCode(fee.code)?.hwf_amount)) && !isTurnOff\">\n <a (click)=\"confirmRemoveFee(fee.id)\" *ngIf=\"(!isPaymentExist || !fee.remissions)\" [ngClass]='isPaymentExist || fee.remissions? \"disable-link\" : \"\"'> <br>Remove</a>\n </span>\n <span class=\"no-border\" *ngIf=\"(!isPaymentExist || (getRemissionByFeeCode(fee.code)?.hwf_amount === 0 || !getRemissionByFeeCode(fee.code)?.hwf_amount)) && isTurnOff \">\n <a (click)=\"confirmRemoveFee(fee.id)\">Remove</a>\n </span>\n\n <a (click)=\"addRemission(fee)\" class=\"remissionActive\" *ngIf=\"(getRemissionByFeeCode(fee.code)?.hwf_amount === 0 || !getRemissionByFeeCode(fee.code)?.hwf_amount) && !isPaymentExist && !isTurnOff\">\n Add help with fees or remission\n </a>\n <a (click)=\"addRemission(fee)\" class=\"remissionActive\" *ngIf=\"(getRemissionByFeeCode(fee.code)?.hwf_amount === 0 || !getRemissionByFeeCode(fee.code)?.hwf_amount) && isTurnOff\">\n Add help with fees or remission\n </a>\n </td>\n <td class=\"govuk-table__cell\" *ngIf=\"fee.volume && fee.volume > 0\">\n {{ fee.volume }}\n </td>\n <td class=\"govuk-table__cell alignright\">\n <br>\n </td>\n <td class=\"govuk-table__cell alignright\" >\n {{ fee.calculated_amount | currency:'GBP':'symbol-narrow':'1.2-2' }}\n </td>\n </tr>\n <tr class=\"govuk-table__row\" *ngIf=\"getRemissionByFeeCode(fee.code)?.hwf_amount > 0\">\n <td>\n <div>Remission {{ getRemissionByFeeCode(fee.code)?.hwf_reference }}</div>\n </td>\n <td>\n <div>1</div>\n </td>\n <td>\n <div></div>\n </td>\n <td>\n <div style=\"text-align: right;\">\n -{{ getRemissionByFeeCode(fee.code)?.hwf_amount? ( getRemissionByFeeCode(fee.code)?.hwf_amount | currency:'GBP':'symbol-narrow':'1.2-2') : '-' }}\n </div>\n </td>\n </tr>\n </ng-container>\n </tbody>\n </table>\n </div>\n <div class=\"addfee\">\n <button *ngIf=\"!isTurnOff\" (click)=\"redirectToFeeSearchPage($event,'summary')\"\n [disabled]=\"isPaymentExist\"\n [ngClass]='isPaymentExist ? \"govuk-button govuk-button--secondary button--disabled\" : \"govuk-button govuk-button--secondary\"'>\n Add fee\n </button>\n <a *ngIf=\"isTurnOff\" (click)=\"redirectToFeeSearchPage($event,'summary')\" class=\"govuk-button govuk-button--secondary\">Add a new fee</a>\n <div class=\"feeAddButton\">\n <p class=\"paddigleft govuk-!-margin-top-2\">Total to pay: {{ outStandingAmount | currency:'GBP':'symbol-narrow':'1.2-2'}}</p>\n </div>\n </div>\n\n<!-- This is section is used when there is more that one payment provider. It is commented as kerv is the default option.\n <div class=\"summaryheader\" *ngIf=\"isTelephonySelectionEnable()\">\n <h3 class=\"heading-medium govuk-!-margin-top-3 govuk-!-margin-bottom-4\">Which system are you using to take a payment?</h3>\n </div>\n\n <div class=\"govuk-radios__item\" *ngIf=\"isTelephonySelectionEnable()\">\n <input class=\"govuk-radios__input\" id=\"paymentSystem\" name=\"paymentSystem\" type=\"radio\" [value]=\"getAntennaValue()\"\n (input)=\"setPaymentValue(getAntennaValue())\"\n />\n <label class=\"govuk-label-fee-summary govuk-radios__label govuk-!-margin-top-2\">Antenna</label>\n </div>\n\n <div class=\"govuk-radios__item\" *ngIf=\"isTelephonySelectionEnable()\">\n <input class=\"govuk-radios__input\" id=\"paymentSystem\" name=\"paymentSystem\" type=\"radio\" [value]=\"getKervValue()\"\n (input)=\"setPaymentValue(getKervValue())\"\n />\n <label class=\"govuk-label-fee-summary govuk-radios__label govuk-!-margin-top-2\">Nexus</label>\n </div>\n-->\n\n\n<!--\n <div class=\"govuk-form-group govuk-form-group--mg\" *ngIf=\"!bsPaymentDcnNumber\">\n <label class=\"govuk-label custom-govuk-label govuk-fieldset__heading--fz\" for=\"responsibleOffice\">\n <strong>What service is this fee for?</strong>\n </label>\n <select class=\"govuk-select govuk-select--custom\" id=\"responsibleOffice\" [(ngModel)]=\"service\" name=\"responsibleOffice\">\n <option value=\"\" selected='selected'>Please select</option>\n <option value=\"AA07\">Divorce</option>\n <option value=\"AA09\">Financial Remedy</option>\n <option value=\"AA08\">Probate</option>\n </select>\n </div> -->\n\n <div>\n <button *ngIf=\"!bsPaymentDcnNumber\" type=\"submit\" (click)=\"takePayment()\"\n [disabled]=\"totalFee <= 0 || isConfirmationBtnDisabled\"\n [ngClass]='totalFee <= 0 || !service || isConfirmationBtnDisabled? \"button button--disabled govuk-!-margin-right-1\" : \"button govuk-!-margin-right-1\"'>\n Take payment\n </button>\n <button *ngIf=\"bsPaymentDcnNumber\" type=\"button\" (click)=\"goToAllocatePage(outStandingAmount, isFeeAmountZero)\" class=\"button govuk-!-margin-right-1\">\n <span class=\"white\" *ngIf=\"outStandingAmount > 0 || (isFeeAmountZero && outStandingAmount === 0)\">\n Allocate payment\n </span>\n <span class=\"white\" *ngIf=\"outStandingAmount < 0 || (!isFeeAmountZero && outStandingAmount === 0)\">\n Continue\n </span>\n </button>\n </div>\n\n</main>\n</div>\n\n <ng-container *ngIf=\"viewStatus === 'feeRemovalConfirmation'\">\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='FEEREMOVALCONFIRMATION_1'>\n <div class=\"govuk-warning-text\">\n <span class=\"govuk-warning-text__icon\" aria-hidden=\"true\">!</span>\n <strong class=\"govuk-warning-text__text\">\n <span class=\"govuk-warning-text__assistive\">Warning</span>\n Are you sure you want to delete this fee?\n </strong>\n </div>\n <div class=\"govuk-button-grb\">\n <form novalidate>\n <button type=\"submit\" class=\"button govuk-button--secondary\" (click)=\"cancelRemission()\">\n Cancel\n </button>\n <button type=\"submit\" class=\"button\"\n *ngIf =\"!isRemoveBtnDisabled\"\n [ngClass]='isRemoveBtnDisabled ? \"button button--disabled govuk-!-margin-right-1\" : \"button govuk-!-margin-right-1\"'\n (click)=\"removeFee(currentFee)\">\n Remove\n </button>\n </form>\n </div>\n </ng-container>\n<ccpay-add-remission *ngIf=\"viewStatus === 'add_remission' && currentFee\"\n [isTurnOff]=\"isTurnOff\"\n [isStrategicFixEnable]=\"isStrategicFixEnable\"\n [fee]=\"currentFee\"\n [caseType]=\"caseType\"\n [ccdCaseNumber]=\"ccdCaseNumber\"\n [paymentGroupRef]=\"paymentGroupRef\"\n (cancelRemission)=\"cancelRemission()\"></ccpay-add-remission>\n <input *ngIf=\"viewStatus === 'payhub_view' && payhubHtml\" #myInput type='hidden' class='iFrameDrivenImageValue' value='PCIPAL'>\n", styles: [".fee-summary .grey-text{color:#6b7376;font-weight:500}.fee-summary .govuk-table{margin-bottom:0}.fee-summary .no-border{border:none;border-bottom:none}.fee-summary table th,.fee-summary table td{font-size:19px;vertical-align:top}.fee-summary table th .no-padding,.fee-summary table td .no-padding{padding:0}.fee-summary table th .subcolumn-1,.fee-summary table td .subcolumn-1{width:45%}.fee-summary table th .subcolumn-2,.fee-summary table td .subcolumn-2{width:25%;text-align:right}.fee-summary table th .subcolumn-3,.fee-summary table td .subcolumn-3{width:30%;text-align:center}.govuk-label-fee-summary{font-size:19px;line-height:1.3157894737}.heading-medium{font-size:20px;line-height:1.11111}table th{font-weight:700}.govuk-button-grb{padding-bottom:20px}.govuk-button-grb .govuk-button--secondary{background-color:#dee0e2;box-shadow:0 2px #858688;color:#0b0c0c;margin-right:10px}.govuk-form-group--mg{margin-top:10px!important}.govuk-fieldset__heading--fz{font-size:16px}.remissionDisable{color:gray;cursor:default}.heading-xlarge{margin:0 0 14px -20px}.govuk-select--custom{width:50%}.disable-link{cursor:default;pointer-events:none;color:#8e8c8c}.govuk-table__header,.govuk-table__cell_border{padding:10px 0 0;border-top:1px solid #bfc1c3;text-align:left}.govuk-table__header,.govuk-table__cell{padding:10px 0}.govuk-table__header,.govuk-table__cell_rmborder{padding:10px 0 0;border-top:1px solid #bfc1c3;text-align:left}.govuk-table__fessheader{font-weight:700}.govuk-button{font-size:19px}.feeAddButton{padding-left:65rem}.remissionActive{padding-left:10px}.paddigleft{padding-left:2em}.govuk-back-link{font-size:1.5rem!important}.govuk-warning-text__text{font-size:19px}.summaryheader{display:flex;flex-direction:row;justify-content:space-between;width:960px}.class600{width:600px}.class60{width:60px}.class80{width:80px;text-align:right}.class100{width:100px;text-align:right}.alignright{text-align:right}.caseref{align-self:flex-end}.addfee{display:flex;flex-direction:row}.white{color:#fff}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: AddRemissionComponent, selector: "ccpay-add-remission", inputs: ["fee", "fees", "payment", "remission", "ccdCaseNumber", "caseType", "viewCompStatus", "paymentGroupRef", "isTurnOff", "isRefundRemission", "isStrategicFixEnable", "paidAmount", "isFromRefundListPage", "isFromPaymentDetailPage", "isFromServiceRequestPage", "isFullyRefund", "feeamount", "refundPaymentReference", "isFromRefundStatusPage", "changeRefundReason", "isServiceRequest", "LOGGEDINUSERROLES", "orderDetail", "orderRef", "orderStatus", "orderParty", "orderCreated", "orderCCDEvent", "takepayment", "orderFeesTotal", "orderTotalPayments", "orderRemissionTotal"], outputs: ["cancelRemission", "refundListReason", "refundListAmount", "refundFees"] }, { kind: "pipe", type: i3.CurrencyPipe, name: "currency" }, { kind: "pipe", type: CcdHyphensPipe, name: "ccdHyphens" }] });
7278
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: FeeSummaryComponent, deps: [{ token: i1$2.Router }, { token: BulkScaningPaymentService }, { token: i3.Location }, { token: PaymentViewService }, { token: 'PAYMENT_LIB' }, { token: OrderslistService }], target: i0.ɵɵFactoryTarget.Component });
7279
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: FeeSummaryComponent, isStandalone: false, selector: "ccpay-fee-summary", inputs: { paymentGroupRef: "paymentGroupRef", ccdCaseNumber: "ccdCaseNumber", isTurnOff: "isTurnOff", caseType: "caseType", telephonySelectionEnable: "telephonySelectionEnable" }, ngImport: i0, template: "\n<div class=\"govuk-breadcrumbs\" *ngIf=\"isBackButtonEnable\">\n <ol class=\"govuk-breadcrumbs__list\">\n <li class=\"govuk-breadcrumbs__list-item\" *ngIf=\"!isTurnOff\">\n <a (click)=\"loadCaseTransactionPage()\" class=\"govuk-back-link govuk-label\">Back</a>\n </li>\n <li class=\"govuk-breadcrumbs__list-item\" *ngIf=\"isTurnOff\">\n <a (click)=\"redirectToFeeSearchPage($event,'summary')\" class=\"govuk-back-link govuk-label\">Back</a>\n </li>\n </ol>\n</div>\n<div class=\"fee-summary\" *ngIf=\"viewStatus === 'main'\">\n <main class=\"govuk-main-wrapper\">\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='FEESUMMARY'>\n <div class=\"summaryheader\">\n <h1 class=\"heading-large govuk-!-margin-top-3 govuk-!-margin-bottom-4\">Summary</h1>\n <p class=\"govuk-!-margin-top-5 caseref\">Case reference:{{ccdCaseNumber | ccdHyphens}}</p>\n </div>\n\n <!-- <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n <h1 class=\"heading-xlarge\">Fee Summary</h1>\n </div>\n\n\n \u00A0<div\u00A0class=\"govuk-grid-column-one-third\"\u00A0align=\"right\">\n \u00A0\u00A0\u00A0\u00A0\u00A0\u00A0<button\u00A0 *ngIf=\"!isTurnOff\" (click)=\"redirectToFeeSearchPage($event,'summary')\"\n \u00A0\u00A0\u00A0\u00A0\u00A0\u00A0[disabled]=\"isPaymentExist\"\n \u00A0\u00A0\u00A0\u00A0\u00A0\u00A0[ngClass]='isPaymentExist ?\u00A0\"button\u00A0button--disabled govuk-!-margin-right-1\"\u00A0:\u00A0\"button govuk-!-margin-right-1\"'>\n Add a new fee\n </button>\n\n <a *ngIf=\"isTurnOff\" (click)=\"redirectToFeeSearchPage($event,'summary')\" class=\"button\">Add a new fee</a>\n </div>\n </div> -->\n\n\n\n\n\n <div *ngIf=\"errorMessage\">\n <div class=\"error-summary\" role=\"group\" aria-labelledby=\"failure-error-summary-heading\" tabindex=\"-1\">\n <h2 class=\"heading-medium error-summary-heading\" id=\"failure-error-summary-heading\">\n An error has occurred on the Fee summary page.\n </h2>\n <div class=\"govuk-error-summary__body\">\n {{ errorMessage }}\n </div>\n </div>\n </div>\n\n <div class=\"govuk-!-margin-top-3\">\n <table class=\"govuk-table govuk-!-margin-bottom-2\" *ngIf=\"paymentGroup\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <th class=\"govuk-table__header\" scope=\"col\" class=\"class600\">Description</th>\n <th class=\"govuk-table__header\" scope=\"col\" class=\"class60\">Quantity</th>\n <th class=\"govuk-table__header\" scope=\"col\" class=\"class80\"></th>\n <th class=\"govuk-table__header\" scope=\"col\" class=\"class100\">Amount</th>\n </tr>\n </thead>\n\n <tbody class=\"govuk-table__body\" *ngIf=\"paymentGroup.fees\">\n <ng-container *ngFor=\"let fee of paymentGroup.fees; let i = index;\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell\">{{ fee.description }}\n <span class=\"no-border\" *ngIf=\"(isPaymentExist || (getRemissionByFeeCode(fee.code)?.hwf_amount === 0 || !getRemissionByFeeCode(fee.code)?.hwf_amount)) && !isTurnOff\">\n <a (click)=\"confirmRemoveFee(fee.id)\" *ngIf=\"(!isPaymentExist || !fee.remissions)\" [ngClass]='isPaymentExist || fee.remissions? \"disable-link\" : \"\"'> <br>Remove</a>\n </span>\n <span class=\"no-border\" *ngIf=\"(!isPaymentExist || (getRemissionByFeeCode(fee.code)?.hwf_amount === 0 || !getRemissionByFeeCode(fee.code)?.hwf_amount)) && isTurnOff \">\n <a (click)=\"confirmRemoveFee(fee.id)\">Remove</a>\n </span>\n\n <a (click)=\"addRemission(fee)\" class=\"remissionActive\" *ngIf=\"(getRemissionByFeeCode(fee.code)?.hwf_amount === 0 || !getRemissionByFeeCode(fee.code)?.hwf_amount) && !isPaymentExist && !isTurnOff\">\n Add help with fees or remission\n </a>\n <a (click)=\"addRemission(fee)\" class=\"remissionActive\" *ngIf=\"(getRemissionByFeeCode(fee.code)?.hwf_amount === 0 || !getRemissionByFeeCode(fee.code)?.hwf_amount) && isTurnOff\">\n Add help with fees or remission\n </a>\n </td>\n <td class=\"govuk-table__cell\" *ngIf=\"fee.volume && fee.volume > 0\">\n {{ fee.volume }}\n </td>\n <td class=\"govuk-table__cell alignright\">\n <br>\n </td>\n <td class=\"govuk-table__cell alignright\" >\n {{ fee.calculated_amount | currency:'GBP':'symbol-narrow':'1.2-2' }}\n </td>\n </tr>\n <tr class=\"govuk-table__row\" *ngIf=\"getRemissionByFeeCode(fee.code)?.hwf_amount > 0\">\n <td>\n <div>Remission {{ getRemissionByFeeCode(fee.code)?.hwf_reference }}</div>\n </td>\n <td>\n <div>1</div>\n </td>\n <td>\n <div></div>\n </td>\n <td>\n <div style=\"text-align: right;\">\n -{{ getRemissionByFeeCode(fee.code)?.hwf_amount? ( getRemissionByFeeCode(fee.code)?.hwf_amount | currency:'GBP':'symbol-narrow':'1.2-2') : '-' }}\n </div>\n </td>\n </tr>\n </ng-container>\n </tbody>\n </table>\n </div>\n <div class=\"addfee\">\n <button *ngIf=\"!isTurnOff\" (click)=\"redirectToFeeSearchPage($event,'summary')\"\n [disabled]=\"isPaymentExist\"\n [ngClass]='isPaymentExist ? \"govuk-button govuk-button--secondary button--disabled\" : \"govuk-button govuk-button--secondary\"'>\n Add fee\n </button>\n <a *ngIf=\"isTurnOff\" (click)=\"redirectToFeeSearchPage($event,'summary')\" class=\"govuk-button govuk-button--secondary\">Add a new fee</a>\n <div class=\"feeAddButton\">\n <p class=\"paddigleft govuk-!-margin-top-2\">Total to pay: {{ outStandingAmount | currency:'GBP':'symbol-narrow':'1.2-2'}}</p>\n </div>\n </div>\n\n<!-- This is section is used when there is more that one payment provider. It is commented as kerv is the default option.\n <div class=\"summaryheader\" *ngIf=\"isTelephonySelectionEnable()\">\n <h3 class=\"heading-medium govuk-!-margin-top-3 govuk-!-margin-bottom-4\">Which system are you using to take a payment?</h3>\n </div>\n\n <div class=\"govuk-radios__item\" *ngIf=\"isTelephonySelectionEnable()\">\n <input class=\"govuk-radios__input\" id=\"paymentSystem\" name=\"paymentSystem\" type=\"radio\" [value]=\"getAntennaValue()\"\n (input)=\"setPaymentValue(getAntennaValue())\"\n />\n <label class=\"govuk-label-fee-summary govuk-radios__label govuk-!-margin-top-2\">Antenna</label>\n </div>\n\n <div class=\"govuk-radios__item\" *ngIf=\"isTelephonySelectionEnable()\">\n <input class=\"govuk-radios__input\" id=\"paymentSystem\" name=\"paymentSystem\" type=\"radio\" [value]=\"getKervValue()\"\n (input)=\"setPaymentValue(getKervValue())\"\n />\n <label class=\"govuk-label-fee-summary govuk-radios__label govuk-!-margin-top-2\">Nexus</label>\n </div>\n-->\n\n\n<!--\n <div class=\"govuk-form-group govuk-form-group--mg\" *ngIf=\"!bsPaymentDcnNumber\">\n <label class=\"govuk-label custom-govuk-label govuk-fieldset__heading--fz\" for=\"responsibleOffice\">\n <strong>What service is this fee for?</strong>\n </label>\n <select class=\"govuk-select govuk-select--custom\" id=\"responsibleOffice\" [(ngModel)]=\"service\" name=\"responsibleOffice\">\n <option value=\"\" selected='selected'>Please select</option>\n <option value=\"AA07\">Divorce</option>\n <option value=\"AA09\">Financial Remedy</option>\n <option value=\"AA08\">Probate</option>\n </select>\n </div> -->\n\n <div>\n <button *ngIf=\"!bsPaymentDcnNumber\" type=\"submit\" (click)=\"takePayment()\"\n [disabled]=\"totalFee <= 0 || isConfirmationBtnDisabled\"\n [ngClass]='totalFee <= 0 || !service || isConfirmationBtnDisabled? \"button button--disabled govuk-!-margin-right-1\" : \"button govuk-!-margin-right-1\"'>\n Take payment\n </button>\n <button *ngIf=\"bsPaymentDcnNumber\" type=\"button\" (click)=\"goToAllocatePage(outStandingAmount, isFeeAmountZero)\" class=\"button govuk-!-margin-right-1\">\n <span class=\"white\" *ngIf=\"outStandingAmount > 0 || (isFeeAmountZero && outStandingAmount === 0)\">\n Allocate payment\n </span>\n <span class=\"white\" *ngIf=\"outStandingAmount < 0 || (!isFeeAmountZero && outStandingAmount === 0)\">\n Continue\n </span>\n </button>\n </div>\n\n</main>\n</div>\n\n <ng-container *ngIf=\"viewStatus === 'feeRemovalConfirmation'\">\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='FEEREMOVALCONFIRMATION_1'>\n <div class=\"govuk-warning-text\">\n <span class=\"govuk-warning-text__icon\" aria-hidden=\"true\">!</span>\n <strong class=\"govuk-warning-text__text\">\n <span class=\"govuk-warning-text__assistive\">Warning</span>\n Are you sure you want to delete this fee?\n </strong>\n </div>\n <div class=\"govuk-button-grb\">\n <form novalidate>\n <button type=\"submit\" class=\"button govuk-button--secondary\" (click)=\"cancelRemission()\">\n Cancel\n </button>\n <button type=\"submit\" class=\"button\"\n *ngIf =\"!isRemoveBtnDisabled\"\n [ngClass]='isRemoveBtnDisabled ? \"button button--disabled govuk-!-margin-right-1\" : \"button govuk-!-margin-right-1\"'\n (click)=\"removeFee(currentFee)\">\n Remove\n </button>\n </form>\n </div>\n </ng-container>\n<ccpay-add-remission *ngIf=\"viewStatus === 'add_remission' && currentFee\"\n [isTurnOff]=\"isTurnOff\"\n [isStrategicFixEnable]=\"isStrategicFixEnable\"\n [fee]=\"currentFee\"\n [caseType]=\"caseType\"\n [ccdCaseNumber]=\"ccdCaseNumber\"\n [paymentGroupRef]=\"paymentGroupRef\"\n (cancelRemission)=\"cancelRemission()\"></ccpay-add-remission>\n <input *ngIf=\"viewStatus === 'payhub_view' && payhubHtml\" #myInput type='hidden' class='iFrameDrivenImageValue' value='PCIPAL'>\n", styles: [".fee-summary .grey-text{color:#6b7376;font-weight:500}.fee-summary .govuk-table{margin-bottom:0}.fee-summary .no-border{border:none;border-bottom:none}.fee-summary table th,.fee-summary table td{font-size:19px;vertical-align:top}.fee-summary table th .no-padding,.fee-summary table td .no-padding{padding:0}.fee-summary table th .subcolumn-1,.fee-summary table td .subcolumn-1{width:45%}.fee-summary table th .subcolumn-2,.fee-summary table td .subcolumn-2{width:25%;text-align:right}.fee-summary table th .subcolumn-3,.fee-summary table td .subcolumn-3{width:30%;text-align:center}.govuk-label-fee-summary{font-size:19px;line-height:1.3157894737}.heading-medium{font-size:20px;line-height:1.11111}table th{font-weight:700}.govuk-button-grb{padding-bottom:20px}.govuk-button-grb .govuk-button--secondary{background-color:#dee0e2;box-shadow:0 2px #858688;color:#0b0c0c;margin-right:10px}.govuk-form-group--mg{margin-top:10px!important}.govuk-fieldset__heading--fz{font-size:16px}.remissionDisable{color:gray;cursor:default}.heading-xlarge{margin:0 0 14px -20px}.govuk-select--custom{width:50%}.disable-link{cursor:default;pointer-events:none;color:#8e8c8c}.govuk-table__header,.govuk-table__cell_border{padding:10px 0 0;border-top:1px solid #bfc1c3;text-align:left}.govuk-table__header,.govuk-table__cell{padding:10px 0}.govuk-table__header,.govuk-table__cell_rmborder{padding:10px 0 0;border-top:1px solid #bfc1c3;text-align:left}.govuk-table__fessheader{font-weight:700}.govuk-button{font-size:19px}.feeAddButton{padding-left:65rem}.remissionActive{padding-left:10px}.paddigleft{padding-left:2em}.govuk-back-link{font-size:1.5rem!important}.govuk-warning-text__text{font-size:19px}.summaryheader{display:flex;flex-direction:row;justify-content:space-between;width:960px}.class600{width:600px}.class60{width:60px}.class80{width:80px;text-align:right}.class100{width:100px;text-align:right}.alignright{text-align:right}.caseref{align-self:flex-end}.addfee{display:flex;flex-direction:row}.white{color:#fff}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: AddRemissionComponent, selector: "ccpay-add-remission", inputs: ["fee", "fees", "payment", "remission", "ccdCaseNumber", "caseType", "viewCompStatus", "paymentGroupRef", "isTurnOff", "isRefundRemission", "isStrategicFixEnable", "paidAmount", "isFromRefundListPage", "isFromPaymentDetailPage", "isFromServiceRequestPage", "isFullyRefund", "feeamount", "refundPaymentReference", "isFromRefundStatusPage", "changeRefundReason", "isServiceRequest", "LOGGEDINUSERROLES", "orderDetail", "orderRef", "orderStatus", "orderParty", "orderCreated", "orderCCDEvent", "takepayment", "orderFeesTotal", "orderTotalPayments", "orderRemissionTotal"], outputs: ["cancelRemission", "refundListReason", "refundListAmount", "refundFees"] }, { kind: "pipe", type: i3.CurrencyPipe, name: "currency" }, { kind: "pipe", type: CcdHyphensPipe, name: "ccdHyphens" }] });
7266
7280
  }
7267
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: FeeSummaryComponent, decorators: [{
7281
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: FeeSummaryComponent, decorators: [{
7268
7282
  type: Component,
7269
7283
  args: [{ selector: 'ccpay-fee-summary', standalone: false, template: "\n<div class=\"govuk-breadcrumbs\" *ngIf=\"isBackButtonEnable\">\n <ol class=\"govuk-breadcrumbs__list\">\n <li class=\"govuk-breadcrumbs__list-item\" *ngIf=\"!isTurnOff\">\n <a (click)=\"loadCaseTransactionPage()\" class=\"govuk-back-link govuk-label\">Back</a>\n </li>\n <li class=\"govuk-breadcrumbs__list-item\" *ngIf=\"isTurnOff\">\n <a (click)=\"redirectToFeeSearchPage($event,'summary')\" class=\"govuk-back-link govuk-label\">Back</a>\n </li>\n </ol>\n</div>\n<div class=\"fee-summary\" *ngIf=\"viewStatus === 'main'\">\n <main class=\"govuk-main-wrapper\">\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='FEESUMMARY'>\n <div class=\"summaryheader\">\n <h1 class=\"heading-large govuk-!-margin-top-3 govuk-!-margin-bottom-4\">Summary</h1>\n <p class=\"govuk-!-margin-top-5 caseref\">Case reference:{{ccdCaseNumber | ccdHyphens}}</p>\n </div>\n\n <!-- <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n <h1 class=\"heading-xlarge\">Fee Summary</h1>\n </div>\n\n\n \u00A0<div\u00A0class=\"govuk-grid-column-one-third\"\u00A0align=\"right\">\n \u00A0\u00A0\u00A0\u00A0\u00A0\u00A0<button\u00A0 *ngIf=\"!isTurnOff\" (click)=\"redirectToFeeSearchPage($event,'summary')\"\n \u00A0\u00A0\u00A0\u00A0\u00A0\u00A0[disabled]=\"isPaymentExist\"\n \u00A0\u00A0\u00A0\u00A0\u00A0\u00A0[ngClass]='isPaymentExist ?\u00A0\"button\u00A0button--disabled govuk-!-margin-right-1\"\u00A0:\u00A0\"button govuk-!-margin-right-1\"'>\n Add a new fee\n </button>\n\n <a *ngIf=\"isTurnOff\" (click)=\"redirectToFeeSearchPage($event,'summary')\" class=\"button\">Add a new fee</a>\n </div>\n </div> -->\n\n\n\n\n\n <div *ngIf=\"errorMessage\">\n <div class=\"error-summary\" role=\"group\" aria-labelledby=\"failure-error-summary-heading\" tabindex=\"-1\">\n <h2 class=\"heading-medium error-summary-heading\" id=\"failure-error-summary-heading\">\n An error has occurred on the Fee summary page.\n </h2>\n <div class=\"govuk-error-summary__body\">\n {{ errorMessage }}\n </div>\n </div>\n </div>\n\n <div class=\"govuk-!-margin-top-3\">\n <table class=\"govuk-table govuk-!-margin-bottom-2\" *ngIf=\"paymentGroup\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <th class=\"govuk-table__header\" scope=\"col\" class=\"class600\">Description</th>\n <th class=\"govuk-table__header\" scope=\"col\" class=\"class60\">Quantity</th>\n <th class=\"govuk-table__header\" scope=\"col\" class=\"class80\"></th>\n <th class=\"govuk-table__header\" scope=\"col\" class=\"class100\">Amount</th>\n </tr>\n </thead>\n\n <tbody class=\"govuk-table__body\" *ngIf=\"paymentGroup.fees\">\n <ng-container *ngFor=\"let fee of paymentGroup.fees; let i = index;\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell\">{{ fee.description }}\n <span class=\"no-border\" *ngIf=\"(isPaymentExist || (getRemissionByFeeCode(fee.code)?.hwf_amount === 0 || !getRemissionByFeeCode(fee.code)?.hwf_amount)) && !isTurnOff\">\n <a (click)=\"confirmRemoveFee(fee.id)\" *ngIf=\"(!isPaymentExist || !fee.remissions)\" [ngClass]='isPaymentExist || fee.remissions? \"disable-link\" : \"\"'> <br>Remove</a>\n </span>\n <span class=\"no-border\" *ngIf=\"(!isPaymentExist || (getRemissionByFeeCode(fee.code)?.hwf_amount === 0 || !getRemissionByFeeCode(fee.code)?.hwf_amount)) && isTurnOff \">\n <a (click)=\"confirmRemoveFee(fee.id)\">Remove</a>\n </span>\n\n <a (click)=\"addRemission(fee)\" class=\"remissionActive\" *ngIf=\"(getRemissionByFeeCode(fee.code)?.hwf_amount === 0 || !getRemissionByFeeCode(fee.code)?.hwf_amount) && !isPaymentExist && !isTurnOff\">\n Add help with fees or remission\n </a>\n <a (click)=\"addRemission(fee)\" class=\"remissionActive\" *ngIf=\"(getRemissionByFeeCode(fee.code)?.hwf_amount === 0 || !getRemissionByFeeCode(fee.code)?.hwf_amount) && isTurnOff\">\n Add help with fees or remission\n </a>\n </td>\n <td class=\"govuk-table__cell\" *ngIf=\"fee.volume && fee.volume > 0\">\n {{ fee.volume }}\n </td>\n <td class=\"govuk-table__cell alignright\">\n <br>\n </td>\n <td class=\"govuk-table__cell alignright\" >\n {{ fee.calculated_amount | currency:'GBP':'symbol-narrow':'1.2-2' }}\n </td>\n </tr>\n <tr class=\"govuk-table__row\" *ngIf=\"getRemissionByFeeCode(fee.code)?.hwf_amount > 0\">\n <td>\n <div>Remission {{ getRemissionByFeeCode(fee.code)?.hwf_reference }}</div>\n </td>\n <td>\n <div>1</div>\n </td>\n <td>\n <div></div>\n </td>\n <td>\n <div style=\"text-align: right;\">\n -{{ getRemissionByFeeCode(fee.code)?.hwf_amount? ( getRemissionByFeeCode(fee.code)?.hwf_amount | currency:'GBP':'symbol-narrow':'1.2-2') : '-' }}\n </div>\n </td>\n </tr>\n </ng-container>\n </tbody>\n </table>\n </div>\n <div class=\"addfee\">\n <button *ngIf=\"!isTurnOff\" (click)=\"redirectToFeeSearchPage($event,'summary')\"\n [disabled]=\"isPaymentExist\"\n [ngClass]='isPaymentExist ? \"govuk-button govuk-button--secondary button--disabled\" : \"govuk-button govuk-button--secondary\"'>\n Add fee\n </button>\n <a *ngIf=\"isTurnOff\" (click)=\"redirectToFeeSearchPage($event,'summary')\" class=\"govuk-button govuk-button--secondary\">Add a new fee</a>\n <div class=\"feeAddButton\">\n <p class=\"paddigleft govuk-!-margin-top-2\">Total to pay: {{ outStandingAmount | currency:'GBP':'symbol-narrow':'1.2-2'}}</p>\n </div>\n </div>\n\n<!-- This is section is used when there is more that one payment provider. It is commented as kerv is the default option.\n <div class=\"summaryheader\" *ngIf=\"isTelephonySelectionEnable()\">\n <h3 class=\"heading-medium govuk-!-margin-top-3 govuk-!-margin-bottom-4\">Which system are you using to take a payment?</h3>\n </div>\n\n <div class=\"govuk-radios__item\" *ngIf=\"isTelephonySelectionEnable()\">\n <input class=\"govuk-radios__input\" id=\"paymentSystem\" name=\"paymentSystem\" type=\"radio\" [value]=\"getAntennaValue()\"\n (input)=\"setPaymentValue(getAntennaValue())\"\n />\n <label class=\"govuk-label-fee-summary govuk-radios__label govuk-!-margin-top-2\">Antenna</label>\n </div>\n\n <div class=\"govuk-radios__item\" *ngIf=\"isTelephonySelectionEnable()\">\n <input class=\"govuk-radios__input\" id=\"paymentSystem\" name=\"paymentSystem\" type=\"radio\" [value]=\"getKervValue()\"\n (input)=\"setPaymentValue(getKervValue())\"\n />\n <label class=\"govuk-label-fee-summary govuk-radios__label govuk-!-margin-top-2\">Nexus</label>\n </div>\n-->\n\n\n<!--\n <div class=\"govuk-form-group govuk-form-group--mg\" *ngIf=\"!bsPaymentDcnNumber\">\n <label class=\"govuk-label custom-govuk-label govuk-fieldset__heading--fz\" for=\"responsibleOffice\">\n <strong>What service is this fee for?</strong>\n </label>\n <select class=\"govuk-select govuk-select--custom\" id=\"responsibleOffice\" [(ngModel)]=\"service\" name=\"responsibleOffice\">\n <option value=\"\" selected='selected'>Please select</option>\n <option value=\"AA07\">Divorce</option>\n <option value=\"AA09\">Financial Remedy</option>\n <option value=\"AA08\">Probate</option>\n </select>\n </div> -->\n\n <div>\n <button *ngIf=\"!bsPaymentDcnNumber\" type=\"submit\" (click)=\"takePayment()\"\n [disabled]=\"totalFee <= 0 || isConfirmationBtnDisabled\"\n [ngClass]='totalFee <= 0 || !service || isConfirmationBtnDisabled? \"button button--disabled govuk-!-margin-right-1\" : \"button govuk-!-margin-right-1\"'>\n Take payment\n </button>\n <button *ngIf=\"bsPaymentDcnNumber\" type=\"button\" (click)=\"goToAllocatePage(outStandingAmount, isFeeAmountZero)\" class=\"button govuk-!-margin-right-1\">\n <span class=\"white\" *ngIf=\"outStandingAmount > 0 || (isFeeAmountZero && outStandingAmount === 0)\">\n Allocate payment\n </span>\n <span class=\"white\" *ngIf=\"outStandingAmount < 0 || (!isFeeAmountZero && outStandingAmount === 0)\">\n Continue\n </span>\n </button>\n </div>\n\n</main>\n</div>\n\n <ng-container *ngIf=\"viewStatus === 'feeRemovalConfirmation'\">\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='FEEREMOVALCONFIRMATION_1'>\n <div class=\"govuk-warning-text\">\n <span class=\"govuk-warning-text__icon\" aria-hidden=\"true\">!</span>\n <strong class=\"govuk-warning-text__text\">\n <span class=\"govuk-warning-text__assistive\">Warning</span>\n Are you sure you want to delete this fee?\n </strong>\n </div>\n <div class=\"govuk-button-grb\">\n <form novalidate>\n <button type=\"submit\" class=\"button govuk-button--secondary\" (click)=\"cancelRemission()\">\n Cancel\n </button>\n <button type=\"submit\" class=\"button\"\n *ngIf =\"!isRemoveBtnDisabled\"\n [ngClass]='isRemoveBtnDisabled ? \"button button--disabled govuk-!-margin-right-1\" : \"button govuk-!-margin-right-1\"'\n (click)=\"removeFee(currentFee)\">\n Remove\n </button>\n </form>\n </div>\n </ng-container>\n<ccpay-add-remission *ngIf=\"viewStatus === 'add_remission' && currentFee\"\n [isTurnOff]=\"isTurnOff\"\n [isStrategicFixEnable]=\"isStrategicFixEnable\"\n [fee]=\"currentFee\"\n [caseType]=\"caseType\"\n [ccdCaseNumber]=\"ccdCaseNumber\"\n [paymentGroupRef]=\"paymentGroupRef\"\n (cancelRemission)=\"cancelRemission()\"></ccpay-add-remission>\n <input *ngIf=\"viewStatus === 'payhub_view' && payhubHtml\" #myInput type='hidden' class='iFrameDrivenImageValue' value='PCIPAL'>\n", styles: [".fee-summary .grey-text{color:#6b7376;font-weight:500}.fee-summary .govuk-table{margin-bottom:0}.fee-summary .no-border{border:none;border-bottom:none}.fee-summary table th,.fee-summary table td{font-size:19px;vertical-align:top}.fee-summary table th .no-padding,.fee-summary table td .no-padding{padding:0}.fee-summary table th .subcolumn-1,.fee-summary table td .subcolumn-1{width:45%}.fee-summary table th .subcolumn-2,.fee-summary table td .subcolumn-2{width:25%;text-align:right}.fee-summary table th .subcolumn-3,.fee-summary table td .subcolumn-3{width:30%;text-align:center}.govuk-label-fee-summary{font-size:19px;line-height:1.3157894737}.heading-medium{font-size:20px;line-height:1.11111}table th{font-weight:700}.govuk-button-grb{padding-bottom:20px}.govuk-button-grb .govuk-button--secondary{background-color:#dee0e2;box-shadow:0 2px #858688;color:#0b0c0c;margin-right:10px}.govuk-form-group--mg{margin-top:10px!important}.govuk-fieldset__heading--fz{font-size:16px}.remissionDisable{color:gray;cursor:default}.heading-xlarge{margin:0 0 14px -20px}.govuk-select--custom{width:50%}.disable-link{cursor:default;pointer-events:none;color:#8e8c8c}.govuk-table__header,.govuk-table__cell_border{padding:10px 0 0;border-top:1px solid #bfc1c3;text-align:left}.govuk-table__header,.govuk-table__cell{padding:10px 0}.govuk-table__header,.govuk-table__cell_rmborder{padding:10px 0 0;border-top:1px solid #bfc1c3;text-align:left}.govuk-table__fessheader{font-weight:700}.govuk-button{font-size:19px}.feeAddButton{padding-left:65rem}.remissionActive{padding-left:10px}.paddigleft{padding-left:2em}.govuk-back-link{font-size:1.5rem!important}.govuk-warning-text__text{font-size:19px}.summaryheader{display:flex;flex-direction:row;justify-content:space-between;width:960px}.class600{width:600px}.class60{width:60px}.class80{width:80px;text-align:right}.class100{width:100px;text-align:right}.alignright{text-align:right}.caseref{align-self:flex-end}.addfee{display:flex;flex-direction:row}.white{color:#fff}\n"] }]
7270
7284
  }], ctorParameters: () => [{ type: i1$2.Router }, { type: BulkScaningPaymentService }, { type: i3.Location }, { type: PaymentViewService }, { type: undefined, decorators: [{
@@ -7486,10 +7500,10 @@ class XlFileService {
7486
7500
  }
7487
7501
  return '';
7488
7502
  }
7489
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: XlFileService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
7490
- static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: XlFileService });
7503
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: XlFileService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
7504
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: XlFileService });
7491
7505
  }
7492
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: XlFileService, decorators: [{
7506
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: XlFileService, decorators: [{
7493
7507
  type: Injectable
7494
7508
  }], ctorParameters: () => [] });
7495
7509
 
@@ -7854,10 +7868,10 @@ class ReportsComponent {
7854
7868
  convertToFloatValue(amt) {
7855
7869
  return amt ? Number.parseFloat(amt).toFixed(2) : '0.00';
7856
7870
  }
7857
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: ReportsComponent, deps: [{ token: XlFileService }, { token: ErrorHandlerService }, { token: i1$1.FormBuilder }, { token: BulkScaningPaymentService }, { token: 'PAYMENT_LIB' }, { token: PaymentViewService }, { token: RefundsService }], target: i0.ɵɵFactoryTarget.Component });
7858
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.1", type: ReportsComponent, isStandalone: false, selector: "ccpay-reports", inputs: { ISPAYMENTSTATUSENABLED: "ISPAYMENTSTATUSENABLED" }, ngImport: i0, template: "<div class=\"header\">\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='REPORTS'>\n <ccpay-error-banner *ngIf=\"errorMessage.showError\" [errorMessage]=\"errorMessage\"></ccpay-error-banner>\n <legend class=\"govuk-fieldset__legend--xl\">\n <h1 class=\"govuk-fieldset__heading\"> Choose the report type and date range</h1>\n </legend>\n</div>\n<form [formGroup]=\"reportsForm\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-radios govuk-radios--conditional\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input\n required\n id=\"DataLoss\"\n class=\"govuk-radios__input\"\n formControlName=\"selectedreport\"\n (click)=\"validateDates('DATA_LOSS')\"\n name=\"selectedreport\"\n type=\"radio\"\n value=\"DATA_LOSS\"\n data-aria-controls=\"DataLoss\"/>\n <label class=\"govuk-label govuk-radios__label govuk-label--m\" for=\"DataLoss\">Data loss</label>\n <span class=\"form-hint\">Missing transactions where data has been received from only either of Exela or Bulk scan</span>\n </div>\n\n <div class=\"govuk-radios__item\">\n <input\n id=\"UnprocessedTransactions\"\n class=\"govuk-radios__input\"\n formControlName=\"selectedreport\"\n (click)=\"validateDates('UNPROCESSED')\"\n name=\"selectedreport\"\n type=\"radio\"\n value=\"UNPROCESSED\"\n data-aria-controls=\"UnprocessedTransactions\"/>\n <label class=\"govuk-label govuk-radios__label govuk-label--m\" for=\"UnprocessedTransactions\">Unprocessed transactions</label>\n <span class=\"form-hint\">Transaction records that are still unprocessed by staff.</span>\n </div>\n\n <div class=\"govuk-radios__item\">\n <input\n id=\"ProcessedUnallocated\"\n class=\"govuk-radios__input\"\n formControlName=\"selectedreport\"\n name=\"selectedreport\"\n (click)=\"validateDates('PROCESSED_UNALLOCATED')\"\n type=\"radio\"\n value=\"PROCESSED_UNALLOCATED\"\n data-aria-controls=\"ProcessedUnallocated\"/>\n <label class=\"govuk-label govuk-radios__label govuk-label--m\" for=\"ProcessedUnallocated\">Processed unallocated</label>\n <span class=\"form-hint\">Payments that are marked as \u2018Unidentified\u2019 or \u2018Transferred\u2019 (Unsolicited requests)</span>\n </div>\n\n <div class=\"govuk-radios__item\">\n <input\n id=\"ShortfallsandSurplus\"\n class=\"govuk-radios__input\"\n formControlName=\"selectedreport\"\n name=\"selectedreport\"\n (click)=\"validateDates('SURPLUS_AND_SHORTFALL')\"\n type=\"radio\"\n value=\"SURPLUS_AND_SHORTFALL\"\n data-aria-controls=\"ShortfallsandSurplus\"/>\n <label class=\"govuk-label govuk-radios__label govuk-label--m\" for=\"ShortfallsandSurplus\">Under payment and Over payment</label>\n <span class=\"form-hint\">Requests where balances are marked as Under payment/Over payment further case management.\n E.g: Refund approval, Customer contact</span>\n </div>\n <div class=\"govuk-radios__item\">\n <input\n id=\"PaymentFailureEvent\"\n class=\"govuk-radios__input\"\n formControlName=\"selectedreport\"\n name=\"selectedreport\"\n (click)=\"validateDates('PAYMENT_FAILURE_EVENT')\"\n type=\"radio\"\n value=\"PAYMENT_FAILURE_EVENT\"\n data-aria-controls=\"PaymentFailureEvent\"/>\n <label class=\"govuk-label govuk-radios__label govuk-label--m\" for=\"PaymentFailureEvent\">Payment failure event</label>\n <span class=\"form-hint\">Failed payment transaction details</span>\n </div>\n <div class=\"govuk-radios__item\">\n <input\n id=\"TelephonyPayments\"\n class=\"govuk-radios__input\"\n formControlName=\"selectedreport\"\n name=\"selectedreport\"\n (click)=\"validateDates('TELEPHONY_PAYMENTS')\"\n type=\"radio\"\n value=\"TELEPHONY_PAYMENTS\"\n data-aria-controls=\"TelephonyPayments\"/>\n <label class=\"govuk-label govuk-radios__label govuk-label--m\" for=\"TelephonyPayments\">Telephony Payments</label>\n <span class=\"form-hint\">All Telephony Payments</span>\n </div>\n <div class=\"govuk-radios__item\">\n <input\n id=\"RefundsEvent\"\n class=\"govuk-radios__input\"\n formControlName=\"selectedreport\"\n name=\"selectedreport\"\n (click)=\"validateDates('REFUNDS')\"\n type=\"radio\"\n value=\"REFUNDS\"\n data-aria-controls=\"RefundsEvent\"/>\n <label class=\"govuk-label govuk-radios__label govuk-label--m\" for=\"RefundsEvent\">Refunds</label>\n <span class=\"form-hint\">Details of refunds</span>\n </div>\n </div>\n </div>\n <div class=\"govuk-form-group\">\n <div class=\"datefrom\">\n <label class=\"govuk-label govuk-radios__label govuk-label--m\" for=\"date-from\">Date from</label>\n <input (change)=\"getSelectedFromDate()\" [max]=\"getToday()\" class=\"form-control\" id=\"date-from\" name=\"date-from\" type=\"date\" formControlName=\"startDate\" required/>\n </div>\n\n <div class=\"dateto\">\n <label class=\"govuk-label govuk-radios__label govuk-label--m\" for=\"date-to\">Date to</label>\n <input (change)=\"getSelectedFromDate()\" [max]=\"getToday()\" class=\"form-control\" id=\"date-to\" name=\"search\" type=\"date\" formControlName=\"endDate\" required/>\n </div>\n </div>\n <p class=\"inline-error-message\" *ngIf=\"isStartDateLesthanEndDate || isDateRangeBetnWeek || isDateBetwnMonth\">\n <span *ngIf=\"isStartDateLesthanEndDate\">Please select 'Date From' less than or equal to 'Date To'</span>\n <span *ngIf=\"isDateRangeBetnWeek\"> Please select the date range between 7 days</span>\n <span *ngIf=\"isDateBetwnMonth\"> Please select the date range between 30 days</span>\n </p>\n <div class=\"btnsubmit\">\n <button type=\"submit\" (click)=\"downloadReport()\" class=\"button\" [disabled]=\"!reportsForm.valid || isDownLoadButtondisabled || isStartDateLesthanEndDate || isDateRangeBetnWeek || isDateBetwnMonth\">Download report</button>\n </div>\n </form>\n\n", styles: [".govuk-radios__input:focus+.govuk-radios__label:before{border-width:4px;-webkit-box-shadow:0 0 0 4px rgb(255,175,0);box-shadow:0 0 0 4px #ffaf00}.datefrom{width:50%;float:left}.dateto{width:50%;float:right}.govuk-label--m{font-size:large}.form-hint{padding-left:.7em}.header{margin-top:10px;margin-bottom:15px}.btnsubmit{margin-bottom:30px}.inline-error-message{color:#a71414;font-weight:700;margin-top:10px}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: ErrorBannerComponent, selector: "ccpay-error-banner", inputs: ["errorMessage"] }] });
7871
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: ReportsComponent, deps: [{ token: XlFileService }, { token: ErrorHandlerService }, { token: i1$1.FormBuilder }, { token: BulkScaningPaymentService }, { token: 'PAYMENT_LIB' }, { token: PaymentViewService }, { token: RefundsService }], target: i0.ɵɵFactoryTarget.Component });
7872
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: ReportsComponent, isStandalone: false, selector: "ccpay-reports", inputs: { ISPAYMENTSTATUSENABLED: "ISPAYMENTSTATUSENABLED" }, ngImport: i0, template: "<div class=\"header\">\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='REPORTS'>\n <ccpay-error-banner *ngIf=\"errorMessage.showError\" [errorMessage]=\"errorMessage\"></ccpay-error-banner>\n <legend class=\"govuk-fieldset__legend--xl\">\n <h1 class=\"govuk-fieldset__heading\"> Choose the report type and date range</h1>\n </legend>\n</div>\n<form [formGroup]=\"reportsForm\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-radios govuk-radios--conditional\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input\n required\n id=\"DataLoss\"\n class=\"govuk-radios__input\"\n formControlName=\"selectedreport\"\n (click)=\"validateDates('DATA_LOSS')\"\n name=\"selectedreport\"\n type=\"radio\"\n value=\"DATA_LOSS\"\n data-aria-controls=\"DataLoss\"/>\n <label class=\"govuk-label govuk-radios__label govuk-label--m\" for=\"DataLoss\">Data loss</label>\n <span class=\"form-hint\">Missing transactions where data has been received from only either of Exela or Bulk scan</span>\n </div>\n\n <div class=\"govuk-radios__item\">\n <input\n id=\"UnprocessedTransactions\"\n class=\"govuk-radios__input\"\n formControlName=\"selectedreport\"\n (click)=\"validateDates('UNPROCESSED')\"\n name=\"selectedreport\"\n type=\"radio\"\n value=\"UNPROCESSED\"\n data-aria-controls=\"UnprocessedTransactions\"/>\n <label class=\"govuk-label govuk-radios__label govuk-label--m\" for=\"UnprocessedTransactions\">Unprocessed transactions</label>\n <span class=\"form-hint\">Transaction records that are still unprocessed by staff.</span>\n </div>\n\n <div class=\"govuk-radios__item\">\n <input\n id=\"ProcessedUnallocated\"\n class=\"govuk-radios__input\"\n formControlName=\"selectedreport\"\n name=\"selectedreport\"\n (click)=\"validateDates('PROCESSED_UNALLOCATED')\"\n type=\"radio\"\n value=\"PROCESSED_UNALLOCATED\"\n data-aria-controls=\"ProcessedUnallocated\"/>\n <label class=\"govuk-label govuk-radios__label govuk-label--m\" for=\"ProcessedUnallocated\">Processed unallocated</label>\n <span class=\"form-hint\">Payments that are marked as \u2018Unidentified\u2019 or \u2018Transferred\u2019 (Unsolicited requests)</span>\n </div>\n\n <div class=\"govuk-radios__item\">\n <input\n id=\"ShortfallsandSurplus\"\n class=\"govuk-radios__input\"\n formControlName=\"selectedreport\"\n name=\"selectedreport\"\n (click)=\"validateDates('SURPLUS_AND_SHORTFALL')\"\n type=\"radio\"\n value=\"SURPLUS_AND_SHORTFALL\"\n data-aria-controls=\"ShortfallsandSurplus\"/>\n <label class=\"govuk-label govuk-radios__label govuk-label--m\" for=\"ShortfallsandSurplus\">Under payment and Over payment</label>\n <span class=\"form-hint\">Requests where balances are marked as Under payment/Over payment further case management.\n E.g: Refund approval, Customer contact</span>\n </div>\n <div class=\"govuk-radios__item\">\n <input\n id=\"PaymentFailureEvent\"\n class=\"govuk-radios__input\"\n formControlName=\"selectedreport\"\n name=\"selectedreport\"\n (click)=\"validateDates('PAYMENT_FAILURE_EVENT')\"\n type=\"radio\"\n value=\"PAYMENT_FAILURE_EVENT\"\n data-aria-controls=\"PaymentFailureEvent\"/>\n <label class=\"govuk-label govuk-radios__label govuk-label--m\" for=\"PaymentFailureEvent\">Payment failure event</label>\n <span class=\"form-hint\">Failed payment transaction details</span>\n </div>\n <div class=\"govuk-radios__item\">\n <input\n id=\"TelephonyPayments\"\n class=\"govuk-radios__input\"\n formControlName=\"selectedreport\"\n name=\"selectedreport\"\n (click)=\"validateDates('TELEPHONY_PAYMENTS')\"\n type=\"radio\"\n value=\"TELEPHONY_PAYMENTS\"\n data-aria-controls=\"TelephonyPayments\"/>\n <label class=\"govuk-label govuk-radios__label govuk-label--m\" for=\"TelephonyPayments\">Telephony Payments</label>\n <span class=\"form-hint\">All Telephony Payments</span>\n </div>\n <div class=\"govuk-radios__item\">\n <input\n id=\"RefundsEvent\"\n class=\"govuk-radios__input\"\n formControlName=\"selectedreport\"\n name=\"selectedreport\"\n (click)=\"validateDates('REFUNDS')\"\n type=\"radio\"\n value=\"REFUNDS\"\n data-aria-controls=\"RefundsEvent\"/>\n <label class=\"govuk-label govuk-radios__label govuk-label--m\" for=\"RefundsEvent\">Refunds</label>\n <span class=\"form-hint\">Details of refunds</span>\n </div>\n </div>\n </div>\n <div class=\"govuk-form-group\">\n <div class=\"datefrom\">\n <label class=\"govuk-label govuk-radios__label govuk-label--m\" for=\"date-from\">Date from</label>\n <input (change)=\"getSelectedFromDate()\" [max]=\"getToday()\" class=\"form-control\" id=\"date-from\" name=\"date-from\" type=\"date\" formControlName=\"startDate\" required/>\n </div>\n\n <div class=\"dateto\">\n <label class=\"govuk-label govuk-radios__label govuk-label--m\" for=\"date-to\">Date to</label>\n <input (change)=\"getSelectedFromDate()\" [max]=\"getToday()\" class=\"form-control\" id=\"date-to\" name=\"search\" type=\"date\" formControlName=\"endDate\" required/>\n </div>\n </div>\n <p class=\"inline-error-message\" *ngIf=\"isStartDateLesthanEndDate || isDateRangeBetnWeek || isDateBetwnMonth\">\n <span *ngIf=\"isStartDateLesthanEndDate\">Please select 'Date From' less than or equal to 'Date To'</span>\n <span *ngIf=\"isDateRangeBetnWeek\"> Please select the date range between 7 days</span>\n <span *ngIf=\"isDateBetwnMonth\"> Please select the date range between 30 days</span>\n </p>\n <div class=\"btnsubmit\">\n <button type=\"submit\" (click)=\"downloadReport()\" class=\"button\" [disabled]=\"!reportsForm.valid || isDownLoadButtondisabled || isStartDateLesthanEndDate || isDateRangeBetnWeek || isDateBetwnMonth\">Download report</button>\n </div>\n </form>\n\n", styles: [".govuk-radios__input:focus+.govuk-radios__label:before{border-width:4px;-webkit-box-shadow:0 0 0 4px rgb(255,175,0);box-shadow:0 0 0 4px #ffaf00}.datefrom{width:50%;float:left}.dateto{width:50%;float:right}.govuk-label--m{font-size:large}.form-hint{padding-left:.7em}.header{margin-top:10px;margin-bottom:15px}.btnsubmit{margin-bottom:30px}.inline-error-message{color:#a71414;font-weight:700;margin-top:10px}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: ErrorBannerComponent, selector: "ccpay-error-banner", inputs: ["errorMessage"] }] });
7859
7873
  }
7860
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: ReportsComponent, decorators: [{
7874
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: ReportsComponent, decorators: [{
7861
7875
  type: Component,
7862
7876
  args: [{ selector: 'ccpay-reports', standalone: false, template: "<div class=\"header\">\n <input #myInput type='hidden' class='iFrameDrivenImageValue' value='REPORTS'>\n <ccpay-error-banner *ngIf=\"errorMessage.showError\" [errorMessage]=\"errorMessage\"></ccpay-error-banner>\n <legend class=\"govuk-fieldset__legend--xl\">\n <h1 class=\"govuk-fieldset__heading\"> Choose the report type and date range</h1>\n </legend>\n</div>\n<form [formGroup]=\"reportsForm\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-radios govuk-radios--conditional\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input\n required\n id=\"DataLoss\"\n class=\"govuk-radios__input\"\n formControlName=\"selectedreport\"\n (click)=\"validateDates('DATA_LOSS')\"\n name=\"selectedreport\"\n type=\"radio\"\n value=\"DATA_LOSS\"\n data-aria-controls=\"DataLoss\"/>\n <label class=\"govuk-label govuk-radios__label govuk-label--m\" for=\"DataLoss\">Data loss</label>\n <span class=\"form-hint\">Missing transactions where data has been received from only either of Exela or Bulk scan</span>\n </div>\n\n <div class=\"govuk-radios__item\">\n <input\n id=\"UnprocessedTransactions\"\n class=\"govuk-radios__input\"\n formControlName=\"selectedreport\"\n (click)=\"validateDates('UNPROCESSED')\"\n name=\"selectedreport\"\n type=\"radio\"\n value=\"UNPROCESSED\"\n data-aria-controls=\"UnprocessedTransactions\"/>\n <label class=\"govuk-label govuk-radios__label govuk-label--m\" for=\"UnprocessedTransactions\">Unprocessed transactions</label>\n <span class=\"form-hint\">Transaction records that are still unprocessed by staff.</span>\n </div>\n\n <div class=\"govuk-radios__item\">\n <input\n id=\"ProcessedUnallocated\"\n class=\"govuk-radios__input\"\n formControlName=\"selectedreport\"\n name=\"selectedreport\"\n (click)=\"validateDates('PROCESSED_UNALLOCATED')\"\n type=\"radio\"\n value=\"PROCESSED_UNALLOCATED\"\n data-aria-controls=\"ProcessedUnallocated\"/>\n <label class=\"govuk-label govuk-radios__label govuk-label--m\" for=\"ProcessedUnallocated\">Processed unallocated</label>\n <span class=\"form-hint\">Payments that are marked as \u2018Unidentified\u2019 or \u2018Transferred\u2019 (Unsolicited requests)</span>\n </div>\n\n <div class=\"govuk-radios__item\">\n <input\n id=\"ShortfallsandSurplus\"\n class=\"govuk-radios__input\"\n formControlName=\"selectedreport\"\n name=\"selectedreport\"\n (click)=\"validateDates('SURPLUS_AND_SHORTFALL')\"\n type=\"radio\"\n value=\"SURPLUS_AND_SHORTFALL\"\n data-aria-controls=\"ShortfallsandSurplus\"/>\n <label class=\"govuk-label govuk-radios__label govuk-label--m\" for=\"ShortfallsandSurplus\">Under payment and Over payment</label>\n <span class=\"form-hint\">Requests where balances are marked as Under payment/Over payment further case management.\n E.g: Refund approval, Customer contact</span>\n </div>\n <div class=\"govuk-radios__item\">\n <input\n id=\"PaymentFailureEvent\"\n class=\"govuk-radios__input\"\n formControlName=\"selectedreport\"\n name=\"selectedreport\"\n (click)=\"validateDates('PAYMENT_FAILURE_EVENT')\"\n type=\"radio\"\n value=\"PAYMENT_FAILURE_EVENT\"\n data-aria-controls=\"PaymentFailureEvent\"/>\n <label class=\"govuk-label govuk-radios__label govuk-label--m\" for=\"PaymentFailureEvent\">Payment failure event</label>\n <span class=\"form-hint\">Failed payment transaction details</span>\n </div>\n <div class=\"govuk-radios__item\">\n <input\n id=\"TelephonyPayments\"\n class=\"govuk-radios__input\"\n formControlName=\"selectedreport\"\n name=\"selectedreport\"\n (click)=\"validateDates('TELEPHONY_PAYMENTS')\"\n type=\"radio\"\n value=\"TELEPHONY_PAYMENTS\"\n data-aria-controls=\"TelephonyPayments\"/>\n <label class=\"govuk-label govuk-radios__label govuk-label--m\" for=\"TelephonyPayments\">Telephony Payments</label>\n <span class=\"form-hint\">All Telephony Payments</span>\n </div>\n <div class=\"govuk-radios__item\">\n <input\n id=\"RefundsEvent\"\n class=\"govuk-radios__input\"\n formControlName=\"selectedreport\"\n name=\"selectedreport\"\n (click)=\"validateDates('REFUNDS')\"\n type=\"radio\"\n value=\"REFUNDS\"\n data-aria-controls=\"RefundsEvent\"/>\n <label class=\"govuk-label govuk-radios__label govuk-label--m\" for=\"RefundsEvent\">Refunds</label>\n <span class=\"form-hint\">Details of refunds</span>\n </div>\n </div>\n </div>\n <div class=\"govuk-form-group\">\n <div class=\"datefrom\">\n <label class=\"govuk-label govuk-radios__label govuk-label--m\" for=\"date-from\">Date from</label>\n <input (change)=\"getSelectedFromDate()\" [max]=\"getToday()\" class=\"form-control\" id=\"date-from\" name=\"date-from\" type=\"date\" formControlName=\"startDate\" required/>\n </div>\n\n <div class=\"dateto\">\n <label class=\"govuk-label govuk-radios__label govuk-label--m\" for=\"date-to\">Date to</label>\n <input (change)=\"getSelectedFromDate()\" [max]=\"getToday()\" class=\"form-control\" id=\"date-to\" name=\"search\" type=\"date\" formControlName=\"endDate\" required/>\n </div>\n </div>\n <p class=\"inline-error-message\" *ngIf=\"isStartDateLesthanEndDate || isDateRangeBetnWeek || isDateBetwnMonth\">\n <span *ngIf=\"isStartDateLesthanEndDate\">Please select 'Date From' less than or equal to 'Date To'</span>\n <span *ngIf=\"isDateRangeBetnWeek\"> Please select the date range between 7 days</span>\n <span *ngIf=\"isDateBetwnMonth\"> Please select the date range between 30 days</span>\n </p>\n <div class=\"btnsubmit\">\n <button type=\"submit\" (click)=\"downloadReport()\" class=\"button\" [disabled]=\"!reportsForm.valid || isDownLoadButtondisabled || isStartDateLesthanEndDate || isDateRangeBetnWeek || isDateBetwnMonth\">Download report</button>\n </div>\n </form>\n\n", styles: [".govuk-radios__input:focus+.govuk-radios__label:before{border-width:4px;-webkit-box-shadow:0 0 0 4px rgb(255,175,0);box-shadow:0 0 0 4px #ffaf00}.datefrom{width:50%;float:left}.dateto{width:50%;float:right}.govuk-label--m{font-size:large}.form-hint{padding-left:.7em}.header{margin-top:10px;margin-bottom:15px}.btnsubmit{margin-bottom:30px}.inline-error-message{color:#a71414;font-weight:700;margin-top:10px}\n"] }]
7863
7877
  }], ctorParameters: () => [{ type: XlFileService }, { type: ErrorHandlerService }, { type: i1$1.FormBuilder }, { type: BulkScaningPaymentService }, { type: undefined, decorators: [{
@@ -8029,7 +8043,7 @@ class PaymentLibComponent {
8029
8043
  if (this.paymentGroup.remissions) {
8030
8044
  remissionTotal = this.paymentGroup.remissions.reduce((totalRemission, remission) => totalRemission + remission.hwf_amount, 0);
8031
8045
  }
8032
- return remissionTotal;
8046
+ return Number(remissionTotal.toFixed(2));
8033
8047
  }
8034
8048
  /**
8035
8049
  * Calculates the total fee amount for the current payment group.
@@ -8045,7 +8059,7 @@ class PaymentLibComponent {
8045
8059
  if (this.paymentGroup.fees) {
8046
8060
  feesTotal = this.paymentGroup.fees.reduce((totalFees, fee) => totalFees + fee.calculated_amount, 0);
8047
8061
  }
8048
- return feesTotal;
8062
+ return Number(feesTotal.toFixed(2));
8049
8063
  }
8050
8064
  /**
8051
8065
  * Calculates the total payment amount for the current payment group.
@@ -8059,9 +8073,9 @@ class PaymentLibComponent {
8059
8073
  getTotalPayments() {
8060
8074
  let paymentsTotal = 0;
8061
8075
  if (this.paymentGroup.payments) {
8062
- paymentsTotal = this.paymentGroup.payments.reduce((totalFees, payment) => totalFees + payment.amount, 0);
8076
+ paymentsTotal = this.paymentGroup.payments.reduce((totalPayments, payment) => totalPayments + payment.amount, 0);
8063
8077
  }
8064
- return paymentsTotal;
8078
+ return Number(paymentsTotal.toFixed(2));
8065
8079
  }
8066
8080
  // Refunds libs section.
8067
8081
  /**
@@ -8110,8 +8124,8 @@ class PaymentLibComponent {
8110
8124
  getRoundedOverPayment() {
8111
8125
  return this.roundTinyValue(this.overPaymentAmount);
8112
8126
  }
8113
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: PaymentLibComponent, deps: [{ token: PaymentLibService }, { token: i0.ChangeDetectorRef }, { token: OrderslistService }], target: i0.ɵɵFactoryTarget.Component });
8114
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.1", type: PaymentLibComponent, isStandalone: false, selector: "ccpay-payment-lib", inputs: { API_ROOT: "API_ROOT", BULKSCAN_API_ROOT: "BULKSCAN_API_ROOT", REFUNDS_API_ROOT: "REFUNDS_API_ROOT", NOTIFICATION_API_ROOT: "NOTIFICATION_API_ROOT", CARDPAYMENTRETURNURL: "CARDPAYMENTRETURNURL", CCD_CASE_NUMBER: "CCD_CASE_NUMBER", EXC_REFERENCE: "EXC_REFERENCE", PAYMENT_METHOD: "PAYMENT_METHOD", VIEW: "VIEW", VIEWSERVICE: "VIEWSERVICE", PAYMENT_GROUP_REF: "PAYMENT_GROUP_REF", TAKEPAYMENT: "TAKEPAYMENT", SERVICEREQUEST: "SERVICEREQUEST", DCN_NUMBER: "DCN_NUMBER", SELECTED_OPTION: "SELECTED_OPTION", ISBSENABLE: "ISBSENABLE", ISSFENABLE: "ISSFENABLE", ISTURNOFF: "ISTURNOFF", CASETYPE: "CASETYPE", ISPAYMENTSTATUSENABLED: "ISPAYMENTSTATUSENABLED", rootUrl: "rootUrl", REFUNDLIST: "REFUNDLIST", USERID: "USERID", LOGGEDINUSERROLES: "LOGGEDINUSERROLES", LOGGEDINUSEREMAIL: "LOGGEDINUSEREMAIL", isFromServiceRequestPage: "isFromServiceRequestPage", telephonySelectionEnable: "telephonySelectionEnable" }, providers: [{ provide: 'PAYMENT_LIB', useExisting: forwardRef(() => PaymentLibComponent) }], ngImport: i0, template: `
8127
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: PaymentLibComponent, deps: [{ token: PaymentLibService }, { token: i0.ChangeDetectorRef }, { token: OrderslistService }], target: i0.ɵɵFactoryTarget.Component });
8128
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: PaymentLibComponent, isStandalone: false, selector: "ccpay-payment-lib", inputs: { API_ROOT: "API_ROOT", BULKSCAN_API_ROOT: "BULKSCAN_API_ROOT", REFUNDS_API_ROOT: "REFUNDS_API_ROOT", NOTIFICATION_API_ROOT: "NOTIFICATION_API_ROOT", CARDPAYMENTRETURNURL: "CARDPAYMENTRETURNURL", CCD_CASE_NUMBER: "CCD_CASE_NUMBER", EXC_REFERENCE: "EXC_REFERENCE", PAYMENT_METHOD: "PAYMENT_METHOD", VIEW: "VIEW", VIEWSERVICE: "VIEWSERVICE", PAYMENT_GROUP_REF: "PAYMENT_GROUP_REF", TAKEPAYMENT: "TAKEPAYMENT", SERVICEREQUEST: "SERVICEREQUEST", DCN_NUMBER: "DCN_NUMBER", SELECTED_OPTION: "SELECTED_OPTION", ISBSENABLE: "ISBSENABLE", ISSFENABLE: "ISSFENABLE", ISTURNOFF: "ISTURNOFF", CASETYPE: "CASETYPE", ISPAYMENTSTATUSENABLED: "ISPAYMENTSTATUSENABLED", rootUrl: "rootUrl", REFUNDLIST: "REFUNDLIST", USERID: "USERID", LOGGEDINUSERROLES: "LOGGEDINUSERROLES", LOGGEDINUSEREMAIL: "LOGGEDINUSEREMAIL", isFromServiceRequestPage: "isFromServiceRequestPage", telephonySelectionEnable: "telephonySelectionEnable" }, providers: [{ provide: 'PAYMENT_LIB', useExisting: forwardRef(() => PaymentLibComponent) }], ngImport: i0, template: `
8115
8129
  <ccpay-refund-list [USERID]="USERID" [LOGGEDINUSERROLES]="LOGGEDINUSERROLES" [LOGGEDINUSEREMAIL]="LOGGEDINUSEREMAIL" *ngIf="viewName === 'refund-list'"></ccpay-refund-list>
8116
8130
  <ccpay-payment-list *ngIf="viewName === 'payment-list'"></ccpay-payment-list>
8117
8131
  <ccpay-refund-status
@@ -8151,7 +8165,7 @@ class PaymentLibComponent {
8151
8165
  ></ccpay-reports>
8152
8166
  `, isInline: true, dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: PaymentViewComponent, selector: "ccpay-payment-view", inputs: ["isTurnOff", "isTakePayment", "caseType", "orderRef", "orderStatus", "orderTotalPayments", "payment", "LOGGEDINUSERROLES", "ISPAYMENTSTATUSENABLED", "orderParty", "orderCreated", "orderCCDEvent", "orderFeesTotal", "orderRemissionTotal", "orderDetail", "isServiceRequest"] }, { kind: "component", type: CaseTransactionsComponent, selector: "ccpay-case-transactions", inputs: ["LOGGEDINUSERROLES", "isTakePayment", "isFromServiceRequestPage"] }, { kind: "component", type: RefundStatusComponent, selector: "ccpay-refund-status", inputs: ["LOGGEDINUSERROLES", "API_ROOT", "ccdCaseNumber", "isTurnOff", "orderParty"] }, { kind: "component", type: PbaPaymentComponent, selector: "ccpay-pba-payment", inputs: ["pbaPayOrderRef"] }, { kind: "component", type: PaymentListComponent, selector: "ccpay-payment-list" }, { kind: "component", type: ProcessRefundComponent, selector: "ccpay-process-refund", inputs: ["refundReference", "refundlistsource"] }, { kind: "component", type: RefundListComponent, selector: "ccpay-refund-list", inputs: ["USERID", "LOGGEDINUSERROLES", "LOGGEDINUSEREMAIL"] }, { kind: "component", type: MarkUnidentifiedPaymentComponent, selector: "app-mark-unidentified-payment", inputs: ["caseType"] }, { kind: "component", type: MarkUnsolicitedPaymentComponent, selector: "app-mark-unsolicited-payment", inputs: ["caseType"] }, { kind: "component", type: AllocatePaymentsComponent, selector: "app-allocate-payments", inputs: ["isTurnOff", "caseType"], outputs: ["reasonEventEmitter", "explanationEventEmitter"] }, { kind: "component", type: FeeSummaryComponent, selector: "ccpay-fee-summary", inputs: ["paymentGroupRef", "ccdCaseNumber", "isTurnOff", "caseType", "telephonySelectionEnable"] }, { kind: "component", type: ReportsComponent, selector: "ccpay-reports", inputs: ["ISPAYMENTSTATUSENABLED"] }] });
8153
8167
  }
8154
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: PaymentLibComponent, decorators: [{
8168
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: PaymentLibComponent, decorators: [{
8155
8169
  type: Component,
8156
8170
  args: [{
8157
8171
  selector: 'ccpay-payment-lib',
@@ -8298,10 +8312,10 @@ class CardDetailsService {
8298
8312
  })
8299
8313
  .pipe(catchError(this.errorHandlerService.handleError));
8300
8314
  }
8301
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: CardDetailsService, deps: [{ token: i1.HttpClient }, { token: LoggerService }, { token: ErrorHandlerService }, { token: PaymentLibService }], target: i0.ɵɵFactoryTarget.Injectable });
8302
- static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: CardDetailsService, providedIn: 'root' });
8315
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: CardDetailsService, deps: [{ token: i1.HttpClient }, { token: LoggerService }, { token: ErrorHandlerService }, { token: PaymentLibService }], target: i0.ɵɵFactoryTarget.Injectable });
8316
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: CardDetailsService, providedIn: 'root' });
8303
8317
  }
8304
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: CardDetailsService, decorators: [{
8318
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: CardDetailsService, decorators: [{
8305
8319
  type: Injectable,
8306
8320
  args: [{
8307
8321
  providedIn: 'root'
@@ -8325,21 +8339,21 @@ class CardDetailsComponent {
8325
8339
  get getPaymentReference() {
8326
8340
  return this.paymentReference;
8327
8341
  }
8328
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: CardDetailsComponent, deps: [{ token: CardDetailsService }, { token: PaymentLibComponent }], target: i0.ɵɵFactoryTarget.Component });
8329
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.1", type: CardDetailsComponent, isStandalone: false, selector: "ccpay-card-details", ngImport: i0, template: "\n<div class=\"column\">\n <h2 class=\"heading-medium\">Payment method</h2>\n</div>\n\n<div role=\"group\" aria-labelledby=\"failure-error-summary-heading\" tabindex=\"-1\" *ngIf=\"errorMessage\">\n Payment method unavailable, The payment has either expired or unsuccessful.\n</div>\n\n<div *ngIf=\"!errorMessage && cardDetails\">\n\n<table>\n <tbody>\n <tr>\n <td class=\"bold tb-col-w\">Method</td>\n <td>Card</td>\n </tr>\n <tr>\n <td class=\"bold tb-col-w\">Type</td>\n <td>{{ cardDetails.card_brand }}</td>\n </tr>\n </tbody>\n</table>\n</div>\n\n", styles: [".tb-col-w{width:330px}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
8342
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: CardDetailsComponent, deps: [{ token: CardDetailsService }, { token: PaymentLibComponent }], target: i0.ɵɵFactoryTarget.Component });
8343
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: CardDetailsComponent, isStandalone: false, selector: "ccpay-card-details", ngImport: i0, template: "\n<div class=\"column\">\n <h2 class=\"heading-medium\">Payment method</h2>\n</div>\n\n<div role=\"group\" aria-labelledby=\"failure-error-summary-heading\" tabindex=\"-1\" *ngIf=\"errorMessage\">\n Payment method unavailable, The payment has either expired or unsuccessful.\n</div>\n\n<div *ngIf=\"!errorMessage && cardDetails\">\n\n<table>\n <tbody>\n <tr>\n <td class=\"bold tb-col-w\">Method</td>\n <td>Card</td>\n </tr>\n <tr>\n <td class=\"bold tb-col-w\">Type</td>\n <td>{{ cardDetails.card_brand }}</td>\n </tr>\n </tbody>\n</table>\n</div>\n\n", styles: [".tb-col-w{width:330px}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
8330
8344
  }
8331
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: CardDetailsComponent, decorators: [{
8345
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: CardDetailsComponent, decorators: [{
8332
8346
  type: Component,
8333
8347
  args: [{ selector: 'ccpay-card-details', standalone: false, template: "\n<div class=\"column\">\n <h2 class=\"heading-medium\">Payment method</h2>\n</div>\n\n<div role=\"group\" aria-labelledby=\"failure-error-summary-heading\" tabindex=\"-1\" *ngIf=\"errorMessage\">\n Payment method unavailable, The payment has either expired or unsuccessful.\n</div>\n\n<div *ngIf=\"!errorMessage && cardDetails\">\n\n<table>\n <tbody>\n <tr>\n <td class=\"bold tb-col-w\">Method</td>\n <td>Card</td>\n </tr>\n <tr>\n <td class=\"bold tb-col-w\">Type</td>\n <td>{{ cardDetails.card_brand }}</td>\n </tr>\n </tbody>\n</table>\n</div>\n\n", styles: [".tb-col-w{width:330px}\n"] }]
8334
8348
  }], ctorParameters: () => [{ type: CardDetailsService }, { type: PaymentLibComponent }] });
8335
8349
 
8336
8350
  class PageNotFoundComponent {
8337
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: PageNotFoundComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
8338
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.1", type: PageNotFoundComponent, isStandalone: false, selector: "ng-component", ngImport: i0, template: `
8351
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: PageNotFoundComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
8352
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: PageNotFoundComponent, isStandalone: false, selector: "ng-component", ngImport: i0, template: `
8339
8353
  <h1>This is not the page you were looking for!</h1>
8340
8354
  `, isInline: true });
8341
8355
  }
8342
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: PageNotFoundComponent, decorators: [{
8356
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: PageNotFoundComponent, decorators: [{
8343
8357
  type: Component,
8344
8358
  args: [{
8345
8359
  template: `
@@ -8354,10 +8368,10 @@ class PbaDetailsComponent {
8354
8368
  constructor() { }
8355
8369
  ngOnInit() {
8356
8370
  }
8357
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: PbaDetailsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
8358
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.1", type: PbaDetailsComponent, isStandalone: false, selector: "ccpay-pba-details", inputs: { payment: "payment" }, ngImport: i0, template: "\n <h2 class=\"heading-large\">Payment method</h2>\n <table>\n <tbody>\n <tr>\n <td class=\"bold tb-col-w\">Method</td>\n <td class=\"capitalize\">{{ payment.method | lowercase}}</td>\n </tr>\n <tr>\n <td class=\"bold tb-col-w\">Type</td>\n <td>Credit</td>\n </tr>\n <tr *ngIf=\"payment.organisation_name\">\n <td class=\"bold tb-col-w\">PBA account name</td>\n <td>{{ payment.organisation_name }}</td>\n </tr>\n <tr *ngIf=\"payment.account_number\">\n <td class=\"bold tb-col-w\">PBA number</td>\n <td>{{ payment.account_number }}</td>\n </tr>\n <tr *ngIf=\"payment.customer_reference\">\n <td class=\"bold tb-col-w\">Customer internal reference</td>\n <td>{{ payment.customer_reference }}</td>\n </tr>\n </tbody>\n </table>\n", styles: [".capitalize:first-letter{text-transform:uppercase}.tb-col-w{width:330px}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i3.LowerCasePipe, name: "lowercase" }] });
8371
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: PbaDetailsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
8372
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: PbaDetailsComponent, isStandalone: false, selector: "ccpay-pba-details", inputs: { payment: "payment" }, ngImport: i0, template: "\n <h2 class=\"heading-large\">Payment method</h2>\n <table>\n <tbody>\n <tr>\n <td class=\"bold tb-col-w\">Method</td>\n <td class=\"capitalize\">{{ payment.method | lowercase}}</td>\n </tr>\n <tr>\n <td class=\"bold tb-col-w\">Type</td>\n <td>Credit</td>\n </tr>\n <tr *ngIf=\"payment.organisation_name\">\n <td class=\"bold tb-col-w\">PBA account name</td>\n <td>{{ payment.organisation_name }}</td>\n </tr>\n <tr *ngIf=\"payment.account_number\">\n <td class=\"bold tb-col-w\">PBA number</td>\n <td>{{ payment.account_number }}</td>\n </tr>\n <tr *ngIf=\"payment.customer_reference\">\n <td class=\"bold tb-col-w\">Customer internal reference</td>\n <td>{{ payment.customer_reference }}</td>\n </tr>\n </tbody>\n </table>\n", styles: [".capitalize:first-letter{text-transform:uppercase}.tb-col-w{width:330px}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i3.LowerCasePipe, name: "lowercase" }] });
8359
8373
  }
8360
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: PbaDetailsComponent, decorators: [{
8374
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: PbaDetailsComponent, decorators: [{
8361
8375
  type: Component,
8362
8376
  args: [{ selector: 'ccpay-pba-details', standalone: false, template: "\n <h2 class=\"heading-large\">Payment method</h2>\n <table>\n <tbody>\n <tr>\n <td class=\"bold tb-col-w\">Method</td>\n <td class=\"capitalize\">{{ payment.method | lowercase}}</td>\n </tr>\n <tr>\n <td class=\"bold tb-col-w\">Type</td>\n <td>Credit</td>\n </tr>\n <tr *ngIf=\"payment.organisation_name\">\n <td class=\"bold tb-col-w\">PBA account name</td>\n <td>{{ payment.organisation_name }}</td>\n </tr>\n <tr *ngIf=\"payment.account_number\">\n <td class=\"bold tb-col-w\">PBA number</td>\n <td>{{ payment.account_number }}</td>\n </tr>\n <tr *ngIf=\"payment.customer_reference\">\n <td class=\"bold tb-col-w\">Customer internal reference</td>\n <td>{{ payment.customer_reference }}</td>\n </tr>\n </tbody>\n </table>\n", styles: [".capitalize:first-letter{text-transform:uppercase}.tb-col-w{width:330px}\n"] }]
8363
8377
  }], ctorParameters: () => [], propDecorators: { payment: [{
@@ -8395,10 +8409,10 @@ class ConsoleLoggerService {
8395
8409
  const logFn = (console)[type] || console.log || noop;
8396
8410
  logFn.apply(console, [args]);
8397
8411
  }
8398
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: ConsoleLoggerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
8399
- static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: ConsoleLoggerService, providedIn: 'root' });
8412
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: ConsoleLoggerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
8413
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: ConsoleLoggerService, providedIn: 'root' });
8400
8414
  }
8401
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: ConsoleLoggerService, decorators: [{
8415
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: ConsoleLoggerService, decorators: [{
8402
8416
  type: Injectable,
8403
8417
  args: [{
8404
8418
  providedIn: 'root'
@@ -8422,10 +8436,10 @@ class ProcessedPaymentsComponent {
8422
8436
  redirectToPaymentViewPage(paymentGroupReference, paymentReference, paymentMethod) {
8423
8437
  this.goToPaymentViewComponent.emit({ paymentGroupReference, paymentReference, paymentMethod });
8424
8438
  }
8425
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: ProcessedPaymentsComponent, deps: [{ token: i1$2.Router }, { token: BulkScaningPaymentService }], target: i0.ɵɵFactoryTarget.Component });
8426
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.1", type: ProcessedPaymentsComponent, isStandalone: false, selector: "ccpay-app-processed-payments", inputs: { NONPAYMENTS: "NONPAYMENTS" }, outputs: { goToPaymentViewComponent: "goToPaymentViewComponent" }, ngImport: i0, template: "<div class=\"processed-payments govuk-grid-column-full govuk-!-padding-bottom-3\">\n <h3 class=\"heading-medium\">Processed payments</h3>\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\">Payment asset number (DCN)</td>\n <td class=\"govuk-table__header\" scope=\"col\">Banked date</td>\n <td class=\"govuk-table__header\" scope=\"col\">Amount</td>\n <td class=\"govuk-table__header\" scope=\"col\">Method</td>\n <td class=\"govuk-table__header\" scope=\"col\">Allocation status</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\" >\n <tr class=\"govuk-table__row\" *ngFor=\"let processedRecord of NONPAYMENTS\">\n <td class=\"govuk-table__cell\">\n <a href=\"javascript:void(0)\" (click)=\"redirectToPaymentViewPage(processedRecord.paymentGroupReference, processedRecord.reference, processedRecord.method)\">{{processedRecord.document_control_number}}</a>\n </td>\n <td class=\"govuk-table__cell\"> {{processedRecord.banked_date | date:'dd MMM yyyy'}}</td>\n <td class=\"govuk-table__cell\"> {{processedRecord.amount | currency :'GBP':'symbol':'1.2-2'}}</td>\n <td class=\"capitalize govuk-table__cell\"> {{ trimUnderscore(processedRecord.method) | lowercase}} </td>\n <td class=\"capitalize govuk-table__cell\"> {{ processedRecord.payment_allocation[0] ? processedRecord.payment_allocation[0].allocation_status : '-' }} </td>\n\n </tr>\n <tr class=\"govuk-table__row\" *ngIf=\"NONPAYMENTS.length === 0\">\n <td class=\"govuk-table__cell\" colspan=\"5\">\n No processed payments\n </td>\n\n </tr>\n\n </tbody>\n </table>\n</div>\n", styles: [".lowercase{text-transform:lowercase}.capitalize:first-letter{text-transform:uppercase}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i3.LowerCasePipe, name: "lowercase" }, { kind: "pipe", type: i3.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i3.DatePipe, name: "date" }] });
8439
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: ProcessedPaymentsComponent, deps: [{ token: i1$2.Router }, { token: BulkScaningPaymentService }], target: i0.ɵɵFactoryTarget.Component });
8440
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: ProcessedPaymentsComponent, isStandalone: false, selector: "ccpay-app-processed-payments", inputs: { NONPAYMENTS: "NONPAYMENTS" }, outputs: { goToPaymentViewComponent: "goToPaymentViewComponent" }, ngImport: i0, template: "<div class=\"processed-payments govuk-grid-column-full govuk-!-padding-bottom-3\">\n <h3 class=\"heading-medium\">Processed payments</h3>\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\">Payment asset number (DCN)</td>\n <td class=\"govuk-table__header\" scope=\"col\">Banked date</td>\n <td class=\"govuk-table__header\" scope=\"col\">Amount</td>\n <td class=\"govuk-table__header\" scope=\"col\">Method</td>\n <td class=\"govuk-table__header\" scope=\"col\">Allocation status</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\" >\n <tr class=\"govuk-table__row\" *ngFor=\"let processedRecord of NONPAYMENTS\">\n <td class=\"govuk-table__cell\">\n <a href=\"javascript:void(0)\" (click)=\"redirectToPaymentViewPage(processedRecord.paymentGroupReference, processedRecord.reference, processedRecord.method)\">{{processedRecord.document_control_number}}</a>\n </td>\n <td class=\"govuk-table__cell\"> {{processedRecord.banked_date | date:'dd MMM yyyy'}}</td>\n <td class=\"govuk-table__cell\"> {{processedRecord.amount | currency :'GBP':'symbol':'1.2-2'}}</td>\n <td class=\"capitalize govuk-table__cell\"> {{ trimUnderscore(processedRecord.method) | lowercase}} </td>\n <td class=\"capitalize govuk-table__cell\"> {{ processedRecord.payment_allocation[0] ? processedRecord.payment_allocation[0].allocation_status : '-' }} </td>\n\n </tr>\n <tr class=\"govuk-table__row\" *ngIf=\"NONPAYMENTS.length === 0\">\n <td class=\"govuk-table__cell\" colspan=\"5\">\n No processed payments\n </td>\n\n </tr>\n\n </tbody>\n </table>\n</div>\n", styles: [".lowercase{text-transform:lowercase}.capitalize:first-letter{text-transform:uppercase}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i3.LowerCasePipe, name: "lowercase" }, { kind: "pipe", type: i3.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i3.DatePipe, name: "date" }] });
8427
8441
  }
8428
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: ProcessedPaymentsComponent, decorators: [{
8442
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: ProcessedPaymentsComponent, decorators: [{
8429
8443
  type: Component,
8430
8444
  args: [{ selector: 'ccpay-app-processed-payments', standalone: false, template: "<div class=\"processed-payments govuk-grid-column-full govuk-!-padding-bottom-3\">\n <h3 class=\"heading-medium\">Processed payments</h3>\n <table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__header\" scope=\"col\">Payment asset number (DCN)</td>\n <td class=\"govuk-table__header\" scope=\"col\">Banked date</td>\n <td class=\"govuk-table__header\" scope=\"col\">Amount</td>\n <td class=\"govuk-table__header\" scope=\"col\">Method</td>\n <td class=\"govuk-table__header\" scope=\"col\">Allocation status</td>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\" >\n <tr class=\"govuk-table__row\" *ngFor=\"let processedRecord of NONPAYMENTS\">\n <td class=\"govuk-table__cell\">\n <a href=\"javascript:void(0)\" (click)=\"redirectToPaymentViewPage(processedRecord.paymentGroupReference, processedRecord.reference, processedRecord.method)\">{{processedRecord.document_control_number}}</a>\n </td>\n <td class=\"govuk-table__cell\"> {{processedRecord.banked_date | date:'dd MMM yyyy'}}</td>\n <td class=\"govuk-table__cell\"> {{processedRecord.amount | currency :'GBP':'symbol':'1.2-2'}}</td>\n <td class=\"capitalize govuk-table__cell\"> {{ trimUnderscore(processedRecord.method) | lowercase}} </td>\n <td class=\"capitalize govuk-table__cell\"> {{ processedRecord.payment_allocation[0] ? processedRecord.payment_allocation[0].allocation_status : '-' }} </td>\n\n </tr>\n <tr class=\"govuk-table__row\" *ngIf=\"NONPAYMENTS.length === 0\">\n <td class=\"govuk-table__cell\" colspan=\"5\">\n No processed payments\n </td>\n\n </tr>\n\n </tbody>\n </table>\n</div>\n", styles: [".lowercase{text-transform:lowercase}.capitalize:first-letter{text-transform:uppercase}\n"] }]
8431
8445
  }], ctorParameters: () => [{ type: i1$2.Router }, { type: BulkScaningPaymentService }], propDecorators: { NONPAYMENTS: [{
@@ -8443,10 +8457,10 @@ class SanitizeHtmlPipe {
8443
8457
  transform(value) {
8444
8458
  return this.sanitizer.bypassSecurityTrustHtml(value);
8445
8459
  }
8446
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: SanitizeHtmlPipe, deps: [{ token: i2.DomSanitizer }], target: i0.ɵɵFactoryTarget.Pipe });
8447
- static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.1", ngImport: i0, type: SanitizeHtmlPipe, isStandalone: false, name: "sanitizeHtml" });
8460
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: SanitizeHtmlPipe, deps: [{ token: i2.DomSanitizer }], target: i0.ɵɵFactoryTarget.Pipe });
8461
+ static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.18", ngImport: i0, type: SanitizeHtmlPipe, isStandalone: false, name: "sanitizeHtml" });
8448
8462
  }
8449
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: SanitizeHtmlPipe, decorators: [{
8463
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: SanitizeHtmlPipe, decorators: [{
8450
8464
  type: Pipe,
8451
8465
  args: [{
8452
8466
  name: 'sanitizeHtml',
@@ -8455,8 +8469,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImpor
8455
8469
  }], ctorParameters: () => [{ type: i2.DomSanitizer }] });
8456
8470
 
8457
8471
  class PaymentLibModule {
8458
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: PaymentLibModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
8459
- static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.1", ngImport: i0, type: PaymentLibModule, declarations: [PaymentLibComponent,
8472
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: PaymentLibModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
8473
+ static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.18", ngImport: i0, type: PaymentLibModule, declarations: [PaymentLibComponent,
8460
8474
  PaymentListComponent,
8461
8475
  //PaymentViewComponent,
8462
8476
  //ContactDetailsComponent,
@@ -8500,7 +8514,7 @@ class PaymentLibModule {
8500
8514
  RefundStatusComponent,
8501
8515
  PbaPaymentComponent,
8502
8516
  StatusHistoryComponent, i8.RpxTranslationModule], exports: [PaymentLibComponent] });
8503
- static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: PaymentLibModule, providers: [
8517
+ static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: PaymentLibModule, providers: [
8504
8518
  { provide: LoggerService, useClass: ConsoleLoggerService },
8505
8519
  XlFileService,
8506
8520
  WebComponentHttpClient,
@@ -8527,7 +8541,7 @@ class PaymentLibModule {
8527
8541
  // NoopAnimationsModule
8528
8542
  RpxTranslationModule.forChild()] });
8529
8543
  }
8530
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: PaymentLibModule, decorators: [{
8544
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: PaymentLibModule, decorators: [{
8531
8545
  type: NgModule,
8532
8546
  args: [{ declarations: [
8533
8547
  PaymentLibComponent,