@hmcts/ccpay-web-component 3.0.26 → 3.0.30

package/hmcts-ccpay-web-component.metadata.json

@@ -1 +1 @@
-{"__symbolic":"module","version":4,"metadata":{"PaymentLibService":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":2,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor"}],"setApiRootUrl":[{"__symbolic":"method"}],"getApiRootUrl":[{"__symbolic":"method"}],"setBulkScanApiRootUrl":[{"__symbolic":"method"}],"getBulkScanApiRootUrl":[{"__symbolic":"method"}]},"statics":{"ngInjectableDef":{}}},"PaymentLibComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":4,"character":1},"arguments":[{"selector":"ccpay-payment-lib","template":"\n    <ccpay-payment-list *ngIf=\"viewName === 'payment-list'\"></ccpay-payment-list>\n    <ccpay-payment-view *ngIf=\"viewName === 'payment-view'\"\n    [isTurnOff]=\"ISTURNOFF\"></ccpay-payment-view>\n    <ccpay-case-transactions  *ngIf=\"viewName === 'case-transactions'\"></ccpay-case-transactions>\n    <app-mark-unidentified-payment *ngIf=\"viewName === 'unidentifiedPage'\"></app-mark-unidentified-payment>\n    <app-mark-unsolicited-payment *ngIf=\"viewName === 'unsolicitedPage'\"></app-mark-unsolicited-payment>\n    <app-allocate-payments *ngIf=\"viewName === 'allocate-payments'\"\n    [isTurnOff]=\"ISTURNOFF\"></app-allocate-payments>\n    <ccpay-fee-summary *ngIf=\"viewName === 'fee-summary'\"\n      [ccdCaseNumber]=\"CCD_CASE_NUMBER\" [paymentGroupRef]=\"paymentGroupReference\"\n      [isTurnOff]=\"ISTURNOFF\"></ccpay-fee-summary>\n    <ccpay-reports *ngIf=\"viewName === 'reports'\"></ccpay-reports>\n    "}]}],"members":{"API_ROOT":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":23,"character":3},"arguments":["API_ROOT"]}]}],"BULKSCAN_API_ROOT":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":24,"character":3},"arguments":["BULKSCAN_API_ROOT"]}]}],"CCD_CASE_NUMBER":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":25,"character":3},"arguments":["CCD_CASE_NUMBER"]}]}],"EXC_REFERENCE":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":26,"character":3},"arguments":["EXC_REFERENCE"]}]}],"PAYMENT_METHOD":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":27,"character":3},"arguments":["PAYMENT_METHOD"]}]}],"VIEW":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":28,"character":3},"arguments":["VIEW"]}]}],"PAYMENT_GROUP_REF":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":29,"character":3},"arguments":["PAYMENT_GROUP_REF"]}]}],"TAKEPAYMENT":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":30,"character":3},"arguments":["TAKEPAYMENT"]}]}],"DCN_NUMBER":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":31,"character":3},"arguments":["DCN_NUMBER"]}]}],"SELECTED_OPTION":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":32,"character":3},"arguments":["SELECTED_OPTION"]}]}],"ISBSENABLE":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":33,"character":3},"arguments":["ISBSENABLE"]}]}],"ISSFENABLE":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":34,"character":3},"arguments":["ISSFENABLE"]}]}],"ISTURNOFF":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":35,"character":3},"arguments":["ISTURNOFF"]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"PaymentLibService"}]}],"ngOnInit":[{"__symbolic":"method"}]}},"PaymentLibModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":31,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":33,"character":4},{"__symbolic":"reference","module":"@angular/common/http","name":"HttpClientModule","line":34,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":35,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"ReactiveFormsModule","line":36,"character":4}],"declarations":[{"__symbolic":"reference","name":"PaymentLibComponent"},{"__symbolic":"reference","name":"ɵa"},{"__symbolic":"reference","name":"ɵe"},{"__symbolic":"reference","name":"ɵh"},{"__symbolic":"reference","name":"ɵj"},{"__symbolic":"reference","name":"ɵk"},{"__symbolic":"reference","name":"ɵm"},{"__symbolic":"reference","name":"ɵo"},{"__symbolic":"reference","name":"ɵp"},{"__symbolic":"reference","name":"ɵq"},{"__symbolic":"reference","name":"ɵr"},{"__symbolic":"reference","name":"ɵt"},{"__symbolic":"reference","name":"ɵu"},{"__symbolic":"reference","name":"ɵv"},{"__symbolic":"reference","name":"ɵw"},{"__symbolic":"reference","name":"ɵx"},{"__symbolic":"reference","name":"ɵy"},{"__symbolic":"reference","name":"ɵz"},{"__symbolic":"reference","name":"ɵba"},{"__symbolic":"reference","name":"ɵbc"}],"exports":[{"__symbolic":"reference","name":"PaymentLibComponent"}],"providers":[{"provide":{"__symbolic":"reference","name":"ɵc"},"useClass":{"__symbolic":"reference","name":"ɵbd"}},{"__symbolic":"reference","name":"ɵbb"},{"__symbolic":"reference","name":"ɵg"}]}]}],"members":{}},"ɵa":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":7,"character":1},"arguments":[{"selector":"ccpay-payment-list","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 hh:mm:ss' }}</td>\n        <td class=\"font-xsmall\">{{ payment.channel | titlecase }}</td>\n        <td class=\"font-xsmall\">{{ payment.method | titlecase }}</td>\n        <td class=\"font-xsmall\">£{{ 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 “Cancel payment” 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":[""]}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ɵb"},{"__symbolic":"reference","name":"PaymentLibComponent"}]}],"ngOnInit":[{"__symbolic":"method"}],"loadPaymentViewComponent":[{"__symbolic":"method"}]}},"ɵb":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":10,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/common/http","name":"HttpClient","line":16,"character":28},{"__symbolic":"reference","name":"ɵc"},{"__symbolic":"reference","name":"ɵd"},{"__symbolic":"reference","name":"PaymentLibService"}]}],"getPaymentByCcdCaseNumber":[{"__symbolic":"method"}]},"statics":{"ngInjectableDef":{}}},"ɵc":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":11,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"invokeConsoleMethod":[{"__symbolic":"method"}]},"statics":{"ngInjectableDef":{}}},"ɵd":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":5,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor"}],"handleError":[{"__symbolic":"method"}],"getServerErrorMessage":[{"__symbolic":"method"}]},"statics":{"ngInjectableDef":{}}},"ɵe":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":7,"character":1},"arguments":[{"selector":"ccpay-payment-view","template":"<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=\"#\" (click)=\"goToCaseTransationPage($event)\" class=\"govuk-back-link\">Back</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\n        </h2>\n        <div class=\"govuk-error-summary__body\">\n          {{ errorMessage }}\n        </div>\n      </div>\n    </div>\n\n    <div *ngIf=\"!errorMessage && paymentGroup\">\n\n      <input #myInput type='hidden' id='iFrameDrivenImageValue' value='PAYMENTDETAILS'>\n      <div class=\"govuk-grid-row\">\n        <div class=\"column\">\n          <h1 class=\"heading-large govuk-!-margin-top-0\">Payment details</h1>\n        </div>\n      </div>\n      <table>\n        <tbody>\n      <tr class=\"section\" *ngIf=\"isTurnOff\">\n          <td class=\"bold tb-col-w\">Payment group reference</td>\n          <td>{{ paymentGroup.payment_group_reference }}</td>\n        </tr>\n        <tr class=\"section\">\n          <td class=\"bold tb-col-w\">Payment reference</td>\n          <td>{{ paymentGroup.payments[0].reference }}</td>\n        </tr>\n        <tr class=\"section\">\n          <td class=\"bold tb-col-w\">Payment amount</td>\n          <td>£{{ paymentGroup.payments[0].amount | number:'.2' }}</td>\n        </tr>\n\n        <tr class=\"section\" *ngIf=\"paymentGroup.payments[0] && paymentGroup.payments[0].document_control_number\">\n          <td class=\"bold tb-col-w\">Payment asset number(DCN)</td>\n          <td>{{ paymentGroup.payments[0].document_control_number }}</td>\n        </tr>\n        <tr class=\"section\" *ngIf=\"paymentGroup.payments[0] && paymentGroup.payments[0].document_control_number\">\n          <td class=\"bold tb-col-w\">Banked date</td>\n          <td>{{ paymentGroup.payments[0].banked_date | date:'dd MMM yyyy' }}</td>\n        </tr>\n        </tbody>\n      </table>\n\n      <div class=\"govuk-grid-row\" *ngIf=\"paymentGroup.fees.length > 0\">\n        <div class=\"column\">\n          <h2 class=\"heading-large\">Fee and remission details</h2>\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</td>\n            <td>Application for {{ fee.description }}</td>\n          </tr>\n          <tr class=\"section\">\n            <td class=\"bold tb-col-w\">Fee code</td>\n            <td>{{ 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</td>\n            <td [ngClass]=\"{'tr-border': !fee.apportion_amount && !fee.remissions && !isTurnOff }\">£{{ fee.calculated_amount | number:'.2' }}</td>\n          </tr>\n          <tr *ngIf=\"fee.net_amount && isTurnOff\">\n            <td class=\"bold tb-col-w\" [ngClass]=\"{'tr-border': !fee.apportion_amount && !fee.remissions}\" >Net amount</td>\n            <td [ngClass]=\"{'tr-border': !fee.apportion_amount && !fee.remissions}\">£{{ fee.net_amount | number:'.2' }}</td>\n          </tr>\n          <tr *ngIf=\"fee.apportion_amount\">\n            <td class=\"bold tb-col-w tr-border\" [ngClass]=\"{'tr-border': !fee.remissions}\">Allocated amount</td>\n            <td [ngClass]=\"{'tr-border': !fee.remissions}\">£{{ fee.apportion_amount | number:'.2' }}</td>\n          </tr>\n\n          <tr *ngIf=\"fee.remissions\">\n            <td class=\"bold tb-col-w\">Remission code</td>\n            <td>{{fee.remissions.hwf_reference}}</td>\n          </tr>\n          <tr *ngIf=\"fee.remissions\">\n            <td class=\"bold tb-col-w tr-border\">Remission amount</td>\n            <td class=\"tr-border\">£{{ fee.remissions.hwf_amount | number:'.2'}}</td>\n          </tr>\n          </tbody>\n        </table>\n\n      </div>\n\n      <!-- card details -->\n      <ccpay-card-details *ngIf=\"isCardPayment && !isTelephonyPayment\"></ccpay-card-details>\n\n      <!-- pba details -->\n      <ccpay-pba-details *ngIf=\"!isCardPayment\" [payment]=\"paymentGroup.payments[0]\"></ccpay-pba-details>\n\n      <!-- Status histories -->\n      <ccpay-payment-statuses *ngIf=\"isStatusAllocated\"></ccpay-payment-statuses>\n\n    </div>\n\n  </main>\n</div>\n","styles":[".tb-col-w{width:330px}.tr-border{border-bottom:2px solid}"]}]}],"members":{"isTurnOff":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":126,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ɵf"},{"__symbolic":"reference","name":"PaymentLibComponent"}]}],"ngOnInit":[{"__symbolic":"method"}],"goToPaymentList":[{"__symbolic":"method"}],"goToCaseTransationPage":[{"__symbolic":"method"}]}},"ɵf":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":20,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/common/http","name":"HttpClient","line":27,"character":28},{"__symbolic":"reference","name":"ɵg"},{"__symbolic":"reference","name":"ɵc"},{"__symbolic":"reference","name":"ɵd"},{"__symbolic":"reference","name":"PaymentLibService"}]}],"getPaymentDetails":[{"__symbolic":"method"}],"getPaymentGroupDetails":[{"__symbolic":"method"}],"getApportionPaymentDetails":[{"__symbolic":"method"}],"postBSPayments":[{"__symbolic":"method"}],"postBSUnidentifiedPayments":[{"__symbolic":"method"}],"postBSUnsolicitedPayments":[{"__symbolic":"method"}],"postBSAllocationPayments":[{"__symbolic":"method"}],"postPaymentGroupWithRemissions":[{"__symbolic":"method"}],"deleteFeeFromPaymentGroup":[{"__symbolic":"method"}],"postPaymentToPayHub":[{"__symbolic":"method"}],"downloadSelectedReport":[{"__symbolic":"method"}],"getBSfeature":[{"__symbolic":"method"}],"getSiteID":[{"__symbolic":"method"}]},"statics":{"ngInjectableDef":{}}},"ɵg":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":5,"character":1}}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/common/http","name":"HttpClient","line":8,"character":18},{"__symbolic":"reference","module":"@angular/platform-browser","name":"Meta","line":9,"character":18}]}],"post":[{"__symbolic":"method"}],"put":[{"__symbolic":"method"}],"get":[{"__symbolic":"method"}],"delete":[{"__symbolic":"method"}],"patch":[{"__symbolic":"method"}],"addHeaders":[{"__symbolic":"method"}]}},"ɵh":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":5,"character":1},"arguments":[{"selector":"ccpay-card-details","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}"]}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ɵi"},{"__symbolic":"reference","name":"PaymentLibComponent"}]}],"ngOnInit":[{"__symbolic":"method"}]}},"ɵi":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":11,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/common/http","name":"HttpClient","line":16,"character":28},{"__symbolic":"reference","name":"ɵc"},{"__symbolic":"reference","name":"ɵd"},{"__symbolic":"reference","name":"PaymentLibService"}]}],"getCardDetails":[{"__symbolic":"method"}]},"statics":{"ngInjectableDef":{}}},"ɵj":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":2,"character":1},"arguments":[{"template":"\n    <h1>This is not the page you were looking for!</h1>\n    "}]}],"members":{}},"ɵk":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":5,"character":1},"arguments":[{"selector":"ccpay-payment-statuses","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>Amount</th>\n          <th>Date</th>\n        </tr>\n      </thead> \n      <tbody>\n        <tr *ngFor=\"let status of statuses.status_histories\">\n          <td>{{ status.status }}</td>\n          <td>£{{ statuses.amount | number:'.2' }}</td>\n          <td>{{ status.date_created | date:'dd MMM yyyy hh:mm:ss'}}</td>\n        </tr>\n    </tbody>\n  </table>\n</div>\n","styles":[""]}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ɵl"},{"__symbolic":"reference","name":"PaymentLibComponent"}]}],"ngOnInit":[{"__symbolic":"method"}]}},"ɵl":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":10,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/common/http","name":"HttpClient","line":15,"character":28},{"__symbolic":"reference","name":"ɵc"},{"__symbolic":"reference","name":"ɵd"},{"__symbolic":"reference","name":"PaymentLibService"}]}],"getPaymentStatusesByReference":[{"__symbolic":"method"}]},"statics":{"ngInjectableDef":{}}},"ɵm":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":9,"character":1},"arguments":[{"selector":"app-mark-unidentified-payment","template":"<div class=\"mkpay-unidentified\" >\n  <div *ngIf=\"viewStatus === 'mainForm'\">\n    <input #myInput  type='hidden' id='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' id='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' id='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:#a71414 solid 3px;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}"]}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/forms","name":"FormBuilder","line":144,"character":35},{"__symbolic":"reference","name":"ɵf"},{"__symbolic":"reference","name":"PaymentLibComponent"},{"__symbolic":"reference","name":"ɵn"}]}],"ngOnInit":[{"__symbolic":"method"}],"getUnassignedPayment":[{"__symbolic":"method"}],"trimUnderscore":[{"__symbolic":"method"}],"saveAndContinue":[{"__symbolic":"method"}],"resetForm":[{"__symbolic":"method"}],"confirmPayments":[{"__symbolic":"method"}],"cancelMarkUnidentifiedPayments":[{"__symbolic":"method"}],"gotoCasetransationPage":[{"__symbolic":"method"}],"getErrorMessage":[{"__symbolic":"method"}]}},"ɵn":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":12,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/common/http","name":"HttpClient","line":17,"character":28},{"__symbolic":"reference","name":"ɵg"},{"__symbolic":"reference","name":"ɵd"},{"__symbolic":"reference","name":"PaymentLibService"}]}],"getBSPaymentsByCCD":[{"__symbolic":"method"}],"getBSPaymentsByDCN":[{"__symbolic":"method"}],"postBSAllocatePayment":[{"__symbolic":"method"}],"postBSPaymentStrategic":[{"__symbolic":"method"}],"postBSWoPGStrategic":[{"__symbolic":"method"}],"patchBSChangeStatus":[{"__symbolic":"method"}],"calculateOutStandingAmount":[{"__symbolic":"method"}],"removeUnwantedString":[{"__symbolic":"method"}],"downloadSelectedReport":[{"__symbolic":"method"}]},"statics":{"ngInjectableDef":{}}},"ɵo":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":11,"character":1},"arguments":[{"selector":"app-mark-unsolicited-payment","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' id='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' id='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' id='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:#a71414 solid 3px;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:#fff}select option{background:#fff}"]}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/forms","name":"FormBuilder","line":163,"character":35},{"__symbolic":"reference","name":"ɵf"},{"__symbolic":"reference","name":"PaymentLibComponent"},{"__symbolic":"reference","name":"ɵn"}]}],"ngOnInit":[{"__symbolic":"method"}],"trimUnderscore":[{"__symbolic":"method"}],"confirmPayments":[{"__symbolic":"method"}],"saveAndContinue":[{"__symbolic":"method"}],"resetForm":[{"__symbolic":"method"}],"cancelMarkUnsolicitedPayments":[{"__symbolic":"method"}],"checkingFormValue":[{"__symbolic":"method"}],"gotoCasetransationPage":[{"__symbolic":"method"}],"getUnassignedPayment":[{"__symbolic":"method"}],"getErrorMessage":[{"__symbolic":"method"}],"selectchange":[{"__symbolic":"method"}]}},"ɵp":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":6,"character":1},"arguments":[{"selector":"ccpay-app-unprocessed-payments","template":"<div class=\"unprocessed-payments govuk-grid-column-full govuk-!-padding-bottom-3\">\n  <input #myInput type='hidden' id='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\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:transparent solid 1px;outline-offset:-1px;-webkit-appearance:none;box-shadow:0 2px 0 #003618}.button.disabled,.button[disabled=disabled],.button[disabled]{zoom:1;opacity:.5}.button.disabled:active,.button[disabled=disabled]:active,.button[disabled]:active{top:0;box-shadow:0 2px 0 #003618}.button[disabled=disabled]{background:#00823b}.lowercase{text-transform:lowercase}.capitalize::first-letter{text-transform:uppercase}.whitespace-inherit{white-space:inherit!important}"]}]}],"members":{"FEE_RECORDS_EXISTS":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":102,"character":3},"arguments":["FEE_RECORDS_EXISTS"]}]}],"PAYMENTREF":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":103,"character":3},"arguments":["PAYMENTREF"]}]}],"ISTURNOFF":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":104,"character":3},"arguments":["ISTURNOFF"]}]}],"IS_BUTTON_ENABLE":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":105,"character":3},"arguments":["IS_BUTTON_ENABLE"]}]}],"IS_OS_AMT_AVAILABLE":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":106,"character":3},"arguments":["IS_OS_AMT_AVAILABLE"]}]}],"ISSFENABLE":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":107,"character":3},"arguments":["ISSFENABLE"]}]}],"selectedUnprocessedFeeEvent":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":109,"character":3}}]}],"getUnprocessedFeeCount":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":110,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"Router","line":130,"character":30},{"__symbolic":"reference","name":"ɵn"},{"__symbolic":"reference","name":"PaymentLibComponent"}]}],"ngOnInit":[{"__symbolic":"method"}],"getUnassignedPaymentlist":[{"__symbolic":"method"}],"setValuesForUnassignedRecord":[{"__symbolic":"method"}],"formatUnassignedRecordId":[{"__symbolic":"method"}],"trimUnderscore":[{"__symbolic":"method"}],"redirectToFeeSearchPage":[{"__symbolic":"method"}],"loadUnsolicitedPage":[{"__symbolic":"method"}],"unprocessedPaymentSelectEvent":[{"__symbolic":"method"}],"goToAllocatePage":[{"__symbolic":"method"}],"validateButtons":[{"__symbolic":"method"}],"unprocessedPaymentUnSelectEvent":[{"__symbolic":"method"}]}},"ɵq":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":5,"character":1},"arguments":[{"selector":"ccpay-app-processed-payments","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}"]}]}],"members":{"NONPAYMENTS":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":45,"character":3},"arguments":["NONPAYMENTS"]}]}],"goToPaymentViewComponent":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":46,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"Router","line":49,"character":20},{"__symbolic":"reference","name":"ɵn"}]}],"ngOnInit":[{"__symbolic":"method"}],"trimUnderscore":[{"__symbolic":"method"}],"redirectToPaymentViewPage":[{"__symbolic":"method"}]}},"ɵr":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":12,"character":1},"arguments":[{"selector":"app-allocate-payments","template":"<div class=\"allocate-payments\">\n  <div *ngIf=\"viewStatus==='mainForm' && isTurnOff\">\n    <input #myInput type='hidden' id='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' id='iFrameDrivenImageValue' value='{{feedbackUrlLabel}}'>\n    <h1 class=\"govuk-heading-xl\">Confirm association</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                [(ngModel)]=\"paymentReason\" value={{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                [(ngModel)]=\"paymentReason\" value={{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                [(ngModel)]=\"paymentExplanation\" value={{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\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                [(ngModel)]=\"paymentExplanation\" value={{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-form-group\" *ngIf=\"isRemainingAmountGtZero || isRemainingAmountLtZero\">\n        <label class=\"govuk-label govuk-font__custom\" for=\"userName\">\n          Enter your name\n        </label>\n        <input class=\"govuk-input\" id=\"userName\" name=\"userName\" type=\"text\"\n          [ngClass]=\"{'inline-error-class': isUserNameEmpty || isUserNameInvalid}\" formControlName=\"userName\">\n        <p class=\"inline-error-message\" *ngIf=\"isUserNameEmpty || isUserNameInvalid\">\n          <span *ngIf=\"isUserNameEmpty\">Enter your name.</span>\n          <span *ngIf=\"isUserNameInvalid\">Enter a valid name</span>\n        </p>\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>","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-font__custom,.allocate-payments .govuk-heading-m--custom,.allocate-payments .govuk-hint,.allocate-payments .govuk-label--m,.allocate-payments .govuk-list__custom,.allocate-payments .govuk-radios__item,.allocate-payments .govuk-warning-text__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:#a71414 solid 3px;outline-offset:0}.allocate-payments .inline-error-message{color:#a71414;font-weight:700;margin-top:10px}.allocate-payments .inline-error-border{border-color:#a71414}"]}]}],"members":{"isTurnOff":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":243,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ɵd"},{"__symbolic":"reference","name":"ɵs"},{"__symbolic":"reference","module":"@angular/forms","name":"FormBuilder","line":316,"character":23},{"__symbolic":"reference","name":"ɵf"},{"__symbolic":"reference","name":"PaymentLibComponent"},{"__symbolic":"reference","name":"ɵn"}]}],"ngOnInit":[{"__symbolic":"method"}],"getGroupOutstandingAmount":[{"__symbolic":"method"}],"getPaymentGroupDetails":[{"__symbolic":"method"}],"selectedPaymentGroup":[{"__symbolic":"method"}],"gotoCasetransationPage":[{"__symbolic":"method"}],"gotoSummaryPage":[{"__symbolic":"method"}],"cancelAllocatePayment":[{"__symbolic":"method"}],"confirmAllocatePayement":[{"__symbolic":"method"}],"resetForm":[{"__symbolic":"method"}],"finalServiceCall":[{"__symbolic":"method"}],"saveAndContinue":[{"__symbolic":"method"}],"getUnassignedPayment":[{"__symbolic":"method"}],"selectRadioButton":[{"__symbolic":"method"}]}},"ɵs":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":9,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/common/http","name":"HttpClient","line":14,"character":28},{"__symbolic":"reference","name":"ɵc"},{"__symbolic":"reference","name":"ɵd"},{"__symbolic":"reference","name":"PaymentLibService"}]}],"getPaymentGroups":[{"__symbolic":"method"}]},"statics":{"ngInjectableDef":{}}},"ɵt":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":3,"character":1},"arguments":[{"selector":"ccpay-pba-details","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}"]}]}],"members":{"payment":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":35,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}]}},"ɵu":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":11,"character":1},"arguments":[{"selector":"ccpay-case-transactions","template":"<div class=\"govuk-width-container\">\n\n  <main class=\"govuk-main-wrapper\">\n    <div *ngIf=\"viewStatus === 'main'&& !isTurnOff && takePayment\">\n\n\n    <div   *ngIf=\"takePayment\" class=\"govuk-grid-row\">\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\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      <ccpay-app-unprocessed-payments\n      *ngIf=\"isBulkScanEnable\"\n      [IS_BUTTON_ENABLE]=\"takePayment\"\n      [FEE_RECORDS_EXISTS]=\"isAnyFeeGroupAvilable\"\n      [ISTURNOFF]=\"isTurnOff\"\n      [ISSFENABLE]=\"isStrategicFixEnable\"\n      [PAYMENTREF]=\"paymentRef\"\n      (getUnprocessedFeeCount) = \"getUnprocessedFeeCount($event)\"\n      (selectedUnprocessedFeeEvent) = \"selectedUnprocessedFeeEvent($event)\">\n      </ccpay-app-unprocessed-payments>\n      <!-- <hr class=\"govuk-section-records-break\">\n      <ccpay-app-processed-payments\n      *ngIf=\"takePayment\" [NONPAYMENTS]=\"nonPayments\"\n      (goToPaymentViewComponent) = \"goToPaymentViewComponent($event)\"\t>\n      </ccpay-app-processed-payments>\n      <hr class=\"govuk-section-records-break\"> -->\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.fee_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 HH:mm:ss' }}</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 HH:mm:ss' }}</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    <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.fee_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 HH:mm:ss' }}</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 yyyy HH:mm:ss' }}</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      [ISTURNOFF]=\"isTurnOff\"\n      [ISSFENABLE]=\"isStrategicFixEnable\"\n      [FEE_RECORDS_EXISTS]=\"isFeeRecordsExist\" \n      [IS_OS_AMT_AVAILABLE]=\"isGrpOutstandingAmtPositive\" \n      (selectedUnprocessedFeeEvent) = \"selectedUnprocessedFeeEvent($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  <ccpay-app-unprocessed-payments\n  *ngIf=\"isBulkScanEnable && !takePayment\"\n  [IS_BUTTON_ENABLE]=\"takePayment\"\n  [ISTURNOFF]=\"isTurnOff\"\n  [ISSFENABLE]=\"isStrategicFixEnable\"\n  [FEE_RECORDS_EXISTS]=\"isFeeRecordsExist\" \n  [IS_OS_AMT_AVAILABLE]=\"isGrpOutstandingAmtPositive\" \n  (selectedUnprocessedFeeEvent) = \"selectedUnprocessedFeeEvent($event)\">\n</ccpay-app-unprocessed-payments>\n\n<div *ngIf=\"!takePayment\" class=\"govuk-grid-row govuk-grid__surplus-payments\">\n      <div class=\"govuk-grid-column-full\">\n    <span class=\"heading-medium\">Processed 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\">Date updated</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=\"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 HH:mm:ss' }}</td>\n            <td class=\"govuk-table__cell whitespace-inherit\">{{ payment.date_updated | date:'dd MMM yyyy HH:mm:ss' }}</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=\"allPayments?.length === 0\">\n        <td class=\"govuk-table__cell\" colspan=\"8\">No payments recorded</td>\n      </tbody>\n    </table>\n</div>\n</div>\n\n<input #myInput type='hidden' id='iFrameDrivenImageValue' value='FEEREMOVALCONFIRMATION_2'>\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>","styles":[".govuk-grid-column-full--gr{position:relative;margin-bottom:10px}.disable{text-decoration:none;cursor:default;color:#fff;background-color:grey;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:0}.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 #000}.totalpayments.govuk-table__row{border-bottom:2px solid #000!important}.govuk-inset-text{margin-left:1em}.govuk-button{font-size:19px}.govuk-table__cell.govuk-table__cell--col6.govuk-table__custom--col6,.groupamount.govuk-table__header{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 #000!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%}.col-15{width:15%}.hmcts-banner>.hmcts-banner__message{font-size:19px;line-height:1.25}.summary-table-font{font-size:36px}"]}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"Router","line":521,"character":30},{"__symbolic":"reference","name":"ɵf"},{"__symbolic":"reference","name":"ɵn"},{"__symbolic":"reference","name":"ɵs"},{"__symbolic":"reference","name":"PaymentLibComponent"}]}],"ngOnInit":[{"__symbolic":"method"}],"setDefaults":[{"__symbolic":"method"}],"getAllocationStatus":[{"__symbolic":"method"}],"checkForExceptionRecord":[{"__symbolic":"method"}],"calculateAmounts":[{"__symbolic":"method"}],"calculateRefundAmount":[{"__symbolic":"method"}],"getGroupOutstandingAmount":[{"__symbolic":"method"}],"redirectToFeeSearchPage":[{"__symbolic":"method"}],"redirectToReportsPage":[{"__symbolic":"method"}],"loadFeeSummaryPage":[{"__symbolic":"method"}],"goToPaymentViewComponent":[{"__symbolic":"method"}],"goToPayementView":[{"__symbolic":"method"}],"selectedUnprocessedFeeEvent":[{"__symbolic":"method"}],"getUnprocessedFeeCount":[{"__symbolic":"method"}],"calculateAmountDue":[{"__symbolic":"method"}],"confirmRemoveFee":[{"__symbolic":"method"}],"cancelRemoval":[{"__symbolic":"method"}],"removeFee":[{"__symbolic":"method"}],"isCheckAmountdueExist":[{"__symbolic":"method"}]}},"ɵv":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":14,"character":1},"arguments":[{"selector":"ccpay-fee-summary","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' id='iFrameDrivenImageValue' value='FEESUMMARY'>\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     <div class=\"govuk-grid-column-one-third\" align=\"right\">\n            <button  *ngIf=\"!isTurnOff\" (click)=\"redirectToFeeSearchPage($event,'summary')\"\n            [disabled]=\"isPaymentExist\"\n            [ngClass]='isPaymentExist ? \"button button--disabled govuk-!-margin-right-1\" : \"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>\t\n    </div>\n  </div>\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        Payment Group details could not be retrieved\n      </h2>\n      <div class=\"govuk-error-summary__body\">\n        {{ errorMessage }}\n      </div>\n    </div>\n  </div>\n\n  <table class=\"govuk-table\"  *ngIf=\"!errorMessage && paymentGroup\">\n    <thead class=\"govuk-table__head\">\n      <tr class=\"govuk-table__row\">\n        <th class=\"govuk-table__header govuk-!-font-weight-bold\" scope=\"col\">Fee Code</th>\n        <th class=\"govuk-table__header govuk-!-font-weight-bold\" scope=\"col\">Fee description</th>\n        <th class=\"govuk-table__header govuk-!-font-weight-bold\" scope=\"col\">Remission code</th>\n        <th class=\"govuk-table__header govuk-!-font-weight-bold\" scope=\"col\"></th>\n      </tr>\n    </thead>\n    <tbody class=\"govuk-table__body\" *ngIf=\"paymentGroup.fees\">\n      <tr class=\"govuk-table__row\" *ngFor=\"let fee of paymentGroup.fees; let i = index;\">\n        <td class=\"govuk-table__cell\">{{ fee.code }}</td>\n        <td class=\"govuk-table__cell\">{{ fee.description }}</td>\n        <td class=\"govuk-table__cell\">{{ getRemissionByFeeCode(fee.code)?.hwf_reference }}</td>\n        <td class=\"govuk-table__cell grey-text\">\n          <table class=\"govuk-table\">\n            <tr class=\"govuk-table__row\">\n              <td class=\"no-border grey-text subcolumn-1\">Fee amount:</td>\n              <td class=\"no-border subcolumn-2\">{{ fee.fee_amount | currency:'GBP':'symbol-narrow':'1.2-2' }}</td>\n              <td class=\"no-border subcolumn-3\" *ngIf=\"!isTurnOff\">\n                <a (click)=\"confirmRemoveFee(fee.id)\" [ngClass]='isPaymentExist || fee.remissions ? \"disable-link\" : \"\"'>remove fee</a>\n              </td>\n              <td class=\"no-border subcolumn-3\" *ngIf=\"isTurnOff\">\n                <a (click)=\"confirmRemoveFee(fee.id)\">remove fee</a>\n              </td>\n            </tr>\n            <tr class=\"govuk-table__row\" *ngIf=\"fee.volume && fee.volume > 0\">\n              <td class=\"no-border grey-text subcolumn-1\">Volume:</td>\n              <td class=\"no-border subcolumn-2\">{{ fee.volume }}</td>\n              <td class=\"no-border subcolumn-3\"></td>\n            </tr>\n            <tr class=\"govuk-table__row\">\n              <td class=\"no-border grey-text subcolumn-1\">Fee total:</td>\n              <td class=\"no-border subcolumn-2\">{{ fee.calculated_amount  | currency:'GBP':'symbol-narrow':'1.2-2' }}</td>\n              <td class=\"no-border subcolumn-3\"></td>\n            </tr>\n            <tr class=\"govuk-table__row\">\n              <td class=\"no-border grey-text subcolumn-1\">Remission amount:</td>\n              <td class=\"no-border subcolumn-2\">{{ getRemissionByFeeCode(fee.code)?.hwf_amount? ( getRemissionByFeeCode(fee.code)?.hwf_amount  | currency:'GBP':'symbol-narrow':'1.2-2') : '-' }}</td>\n              <td class=\"no-border subcolumn-3\" *ngIf=\"!isTurnOff\"> \n                <a (click)=\"addRemission(fee)\" [ngClass]=\"{'remissionDisable': !service}\" *ngIf=\"(getRemissionByFeeCode(fee.code)?.hwf_amount === 0 || !getRemissionByFeeCode(fee.code)?.hwf_amount) && !isPaymentExist\">\n                  Deduct remission\n                </a>\n              </td>\n              <td class=\"no-border subcolumn-3\" *ngIf=\"isTurnOff\"> \n                <a (click)=\"addRemission(fee)\" [ngClass]=\"{'remissionDisable': !service}\" *ngIf=\"getRemissionByFeeCode(fee.code)?.hwf_amount === 0 || !getRemissionByFeeCode(fee.code)?.hwf_amount\">\n                Deduct remission\n              </a>\n              </td>\n                        </tr>\n            <tr class=\"govuk-table__row\">\n              <td class=\"no-border grey-text subcolumn-1\">Total after remission:</td>\n              <td class=\"no-border subcolumn-2\">{{ fee.net_amount  | currency:'GBP':'symbol-narrow':'1.2-2' }}</td>\n              <td class=\"no-border subcolumn-3\"></td>\n            </tr>\n          </table>\n        </td>\n      </tr>\n      <tr class=\"govuk-table__row\">\n        <td class=\"no-border\"></td>\n        <td class=\"no-border\"></td>\n        <td class=\"no-border\"></td>\n        <td class=\"no-border\">\n          <table class=\"govuk-table\">\n            <tr class=\"govuk-table__row\">\n              <td class=\"no-border govuk-!-font-weight-bold subcolumn-1\">Total payment</td>\n              <td class=\"no-border subcolumn-2\">{{ totalAfterRemission - outStandingAmount | currency:'GBP':'symbol-narrow':'1.2-2'}}</td>\n              <td class=\"no-border subcolumn-3\"></td>\n            </tr>\n            <tr class=\"govuk-table__row\">\n              <td class=\"no-border govuk-!-font-weight-bold subcolumn-1\">Total outstanding amount</td>\n              <td class=\"no-border subcolumn-2\">{{ outStandingAmount | currency:'GBP':'symbol-narrow':'1.2-2'}}</td>\n              <td class=\"no-border subcolumn-3\"></td>\n            </tr>\n          </table>\n        </td>\n      </tr>\n\n      <tr class=\"govuk-table__row\" *ngIf=\"!bsPaymentDcnNumber\">\n        <td class=\"no-border\"></td>\n        <td class=\"no-border\"></td>\n        <td class=\"no-border\"></td>\n        <td class=\"no-border\">\n          <div class=\"govuk-form-group govuk-form-group--mg\">\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        </td>\n      </tr>\n    </tbody>\n    <tr class=\"govuk-table__row\">\n      <td class=\"no-border\"></td>\n      <td class=\"no-border\"></td>\n      <td class=\"no-border\"></td>\n      <td class=\"no-border\">\n          <table class=\"govuk-table\">\n            <tr class=\"govuk-table__row\">\n              <td class=\"no-border subcolumn-2\"> \n                <button *ngIf=\"!bsPaymentDcnNumber\" type=\"submit\" (click)=\"takePayment()\"\n                [disabled]=\"totalFee <= 0 || !service || 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 *ngIf=\"outStandingAmount > 0 || (isFeeAmountZero && outStandingAmount === 0)\">\n                  Allocate payment\n                </span>\n                <span *ngIf=\"outStandingAmount < 0 || (!isFeeAmountZero && outStandingAmount === 0)\">\n                  Continue\n                </span>\n              </button>\n              </td>\n            </tr>\n          </table>\n      </td>\n    </tr>\n  </tbody>\n  </table>\n</main>\n</div>\n\n  <ng-container *ngIf=\"viewStatus === 'feeRemovalConfirmation'\">\n    <input #myInput type='hidden' id='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          [disabled]=\"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\n<ccpay-add-remission *ngIf=\"viewStatus === 'add_remission' && currentFee\"\n [isTurnOff]=\"isTurnOff\"\n [isStrategicFixEnable]=\"isStrategicFixEnable\" \n [fee]=\"currentFee\" \n [service]=\"service\" \n [ccdCaseNumber]=\"ccdCaseNumber\" \n [paymentGroupRef]=\"paymentGroupRef\" \n (cancelRemission)=\"cancelRemission()\"></ccpay-add-remission>\n <input *ngIf=\"viewStatus === 'payhub_view' && payhubHtml\" #myInput type='hidden' id='iFrameDrivenImageValue' value='PCIPAL'>\n<div *ngIf=\"viewStatus === 'payhub_view' && payhubHtml\" [innerHTML]=\"payhubHtml | sanitizeHtml\" id=\"payhub-html-id\"></div>\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 td,.fee-summary table th{font-size:15px;font-weight:500;vertical-align:top;max-width:320px}.fee-summary table td .no-padding,.fee-summary table th .no-padding{padding:0}.fee-summary table td .subcolumn-1,.fee-summary table th .subcolumn-1{width:45%}.fee-summary table td .subcolumn-2,.fee-summary table th .subcolumn-2{width:25%;text-align:right}.fee-summary table td .subcolumn-3,.fee-summary table th .subcolumn-3{width:30%;text-align:center}.govuk-button-grb{padding-bottom:20px}.govuk-button-grb .govuk-button--secondary{background-color:#dee0e2;box-shadow:0 2px 0 #858688;color:#0b0c0c;margin-right:10px}.govuk-form-group--mg{margin-top:10px!important}.govuk-fieldset__heading--fz{font-size:16px}.remissionDisable{color:grey;cursor:default}.heading-xlarge{margin:0 0 14px -20px}.govuk-select--custom{width:50%}.disable-link{cursor:default;pointer-events:none;color:#8e8c8c}"]}]}],"members":{"paymentGroupRef":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":226,"character":3}}]}],"ccdCaseNumber":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":227,"character":3}}]}],"isTurnOff":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":228,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"Router","line":252,"character":20},{"__symbolic":"reference","name":"ɵn"},{"__symbolic":"reference","module":"@angular/common","name":"Location","line":254,"character":22},{"__symbolic":"reference","name":"ɵf"},{"__symbolic":"reference","name":"PaymentLibComponent"}]}],"ngOnInit":[{"__symbolic":"method"}],"getUnassignedPaymentlist":[{"__symbolic":"method"}],"getRemissionByFeeCode":[{"__symbolic":"method"}],"addRemission":[{"__symbolic":"method"}],"getPaymentGroup":[{"__symbolic":"method"}],"confirmRemoveFee":[{"__symbolic":"method"}],"removeFee":[{"__symbolic":"method"}],"loadCaseTransactionPage":[{"__symbolic":"method"}],"cancelRemission":[{"__symbolic":"method"}],"redirectToFeeSearchPage":[{"__symbolic":"method"}],"takePayment":[{"__symbolic":"method"}],"goToAllocatePage":[{"__symbolic":"method"}],"isCheckAmountdueExist":[{"__symbolic":"method"}]}},"ɵw":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":10,"character":1},"arguments":[{"selector":"ccpay-add-remission","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  <ng-container *ngIf=\"viewStatus === 'main'\">\n      <input #myInput type='hidden' id='iFrameDrivenImageValue' value='ADDREMISSION'>\n      <h1 class=\"heading-large\">Add remission</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 {{ fee.code }}:{{ fee.description }}\n                <span class=\"form-hint\">Enter remission for reference. For example: HWF-A1B-23C</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</span>\n                <span *ngIf=\"remissionCodeHasError\">Enter a vaild remission code</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?\n              </label>\n\n              <div id=\"amount-currency\" class=\"govuk-visually-hidden\">in pounds</div>\n                <div class=\"hmcts-currency-input\">\n                <div class=\"hmcts-currency-input__symbol\" aria-hidden=\"true\">£</div>\n                <input class=\"govuk-input govuk-input--width-10\" [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</span>\n                  <span *ngIf=\"amountHasError\">Enter a vaild amount</span>\n                  <span *ngIf=\"isRemissionLessThanFeeError\">The remission amount must be less than the total fee</span>\n                </p>\n              </div>\n            </div>\n          </form>\n          <button class=\"button\" type=\"submit\" (click)=\"addRemission()\">\n              Submit\n            </button>\n        </div>\n      </form>\n  </ng-container>\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</span>\n          Are you sure you want to add remission to this fee?\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:</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:</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:</td>\n            <td class=\"govuk-table__cell\">{{ fee.description }}</td>\n        </tr>\n        <tr class=\"govuk-table__row\">\n            <td class=\"govuk-table__cell govuk-!-font-weight-bold\">Amount the applicant must pay:</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\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\n      </button>\n\n    </ng-container>\n\n</div>\n\n","styles":[".add-remission .button{margin:20px 2px}.add-remission td.govuk-table__cell{width:50%}.add-remission .govuk-button--secondary{background-color:#dee0e2;box-shadow:0 2px 0 #858688;color:#0b0c0c;margin-right:.5em}.add-remission .govuk-label--s,.add-remission .govuk-warning-text__text,.add-remission .hmcts-currency-input__symbol{font-size:19px}.add-remission .inline-error-class{outline:#a71414 solid 3px;outline-offset:0}.add-remission .inline-error-message{color:#a71414;font-weight:700;margin-top:10px}"]}]}],"members":{"fee":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":109,"character":3}}]}],"ccdCaseNumber":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":110,"character":3}}]}],"service":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":111,"character":3}}]}],"paymentGroupRef":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":112,"character":3}}]}],"isTurnOff":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":113,"character":3}}]}],"isStrategicFixEnable":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":114,"character":3}}]}],"cancelRemission":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":115,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/forms","name":"FormBuilder","line":131,"character":35},{"__symbolic":"reference","module":"@angular/router","name":"Router","line":132,"character":20},{"__symbolic":"reference","name":"ɵf"},{"__symbolic":"reference","name":"PaymentLibComponent"}]}],"ngOnInit":[{"__symbolic":"method"}],"addRemission":[{"__symbolic":"method"}],"resetRemissionForm":[{"__symbolic":"method"}],"confirmRemission":[{"__symbolic":"method"}],"gotoCasetransationPage":[{"__symbolic":"method"}]}},"ɵx":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Pipe","line":1,"character":1},"arguments":[{"name":"ccdHyphens"}]}],"members":{"__ctor__":[{"__symbolic":"constructor"}],"transform":[{"__symbolic":"method"}]}},"ɵy":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Pipe","line":1,"character":1},"arguments":[{"name":"keyValue"}]}],"members":{"__ctor__":[{"__symbolic":"constructor"}],"transform":[{"__symbolic":"method"}]}},"ɵz":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Pipe","line":3,"character":1},"arguments":[{"name":"sanitizeHtml"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/platform-browser","name":"DomSanitizer","line":5,"character":33}]}],"transform":[{"__symbolic":"method"}]}},"ɵba":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":9,"character":1},"arguments":[{"selector":"ccpay-reports","template":"<div class=\"header\">\n      <input #myInput type='hidden' id='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 ‘Unidentified’ or ‘Transferred’ (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\">Shortfalls and surplus</label>\n            <span class=\"form-hint\">Requests where balances are marked as shortfall/surplus further case management.\n               E.g: Refund approval, Customer contact</span>\n         </div>\n       \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\">\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   </p>\n    <div class=\"btnsubmit\">\n     <button type=\"submit\" (click)=\"downloadReport()\" class=\"button\" [disabled]=\"!reportsForm.valid || isDownLoadButtondisabled || isStartDateLesthanEndDate || isDateRangeBetnWeek\">Download report</button>\n   </div>\n </form>\n    ","styles":[".govuk-radios__input:focus+.govuk-radios__label::before{border-width:4px;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}"]}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ɵbb"},{"__symbolic":"reference","name":"ɵd"},{"__symbolic":"reference","module":"@angular/forms","name":"FormBuilder","line":117,"character":25},{"__symbolic":"reference","name":"ɵn"},{"__symbolic":"reference","name":"ɵf"}]}],"ngOnInit":[{"__symbolic":"method"}],"getToday":[{"__symbolic":"method"}],"getSelectedFromDate":[{"__symbolic":"method"}],"validateDates":[{"__symbolic":"method"}],"fromValidation":[{"__symbolic":"method"}],"downloadReport":[{"__symbolic":"method"}],"getFileName":[{"__symbolic":"method"}],"tranformDate":[{"__symbolic":"method"}],"getTwodigit":[{"__symbolic":"method"}],"getCamelCaseString":[{"__symbolic":"method"}],"applyDateFormat":[{"__symbolic":"method"}],"convertToFloatValue":[{"__symbolic":"method"}]}},"ɵbb":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":9,"character":1}}],"members":{"__ctor__":[{"__symbolic":"constructor"}],"exportAsExcelFile":[{"__symbolic":"method"}],"autoFitColumns":[{"__symbolic":"method"}],"setDataLossReportHeaders":[{"__symbolic":"method"}],"setUnprocessedReportHeaders":[{"__symbolic":"method"}],"setProcessedUnallocatedReportHeaders":[{"__symbolic":"method"}],"setShortFallReportHeaders":[{"__symbolic":"method"}],"saveAsExcelFile":[{"__symbolic":"method"}]}},"ɵbc":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":4,"character":1},"arguments":[{"selector":"ccpay-error-banner","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}"]}]}],"members":{"errorMessage":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":22,"character":3},"arguments":["errorMessage"]}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}]}},"ɵbd":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":7,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"invokeConsoleMethod":[{"__symbolic":"method"}]},"statics":{"ngInjectableDef":{}}}},"origins":{"PaymentLibService":"./lib/payment-lib.service","PaymentLibComponent":"./lib/payment-lib.component","PaymentLibModule":"./lib/payment-lib.module","ɵa":"./lib/components/payment-list/payment-list.component","ɵb":"./lib/services/payment-list/payment-list.service","ɵc":"./lib/services/shared/logger/logger.service","ɵd":"./lib/services/shared/error-handler.service","ɵe":"./lib/components/payment-view/payment-view.component","ɵf":"./lib/services/payment-view/payment-view.service","ɵg":"./lib/services/shared/httpclient/webcomponent.http.client","ɵh":"./lib/components/card-details/card-details.component","ɵi":"./lib/services/card-details/card-details.service","ɵj":"./lib/components/page-not-found.component","ɵk":"./lib/components/status-history/status-history.component","ɵl":"./lib/services/status-history/status-history.service","ɵm":"./lib/components/mark-unidentified-payment/mark-unidentified-payment.component","ɵn":"./lib/services/bulk-scaning-payment/bulk-scaning-payment.service","ɵo":"./lib/components/mark-unsolicited-payment/mark-unsolicited-payment.component","ɵp":"./lib/components/unprocessed-payments/unprocessed-payments.component","ɵq":"./lib/components/processed-payments/processed-payments.component","ɵr":"./lib/components/allocate-payments/allocate-payments.component","ɵs":"./lib/services/case-transactions/case-transactions.service","ɵt":"./lib/components/pba-details/pba-details.component","ɵu":"./lib/components/case-transactions/case-transactions.component","ɵv":"./lib/components/fee-summary/fee-summary.component","ɵw":"./lib/components/add-remission/add-remission.component","ɵx":"./lib/pipes/ccd-hyphens.pipe","ɵy":"./lib/pipes/key-value.pipe","ɵz":"./lib/pipes/sanitize-html.pipe","ɵba":"./lib/components/reports/reports.component","ɵbb":"./lib/services/xl-file/xl-file.service","ɵbc":"./lib/components/error-banner/error-banner.component","ɵbd":"./lib/services/shared/logger/console-logger.service"},"importAs":"@hmcts/ccpay-web-component"}
+{"__symbolic":"module","version":4,"metadata":{"PaymentLibService":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":2,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor"}],"setApiRootUrl":[{"__symbolic":"method"}],"getApiRootUrl":[{"__symbolic":"method"}],"setBulkScanApiRootUrl":[{"__symbolic":"method"}],"getBulkScanApiRootUrl":[{"__symbolic":"method"}]},"statics":{"ngInjectableDef":{}}},"PaymentLibComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":4,"character":1},"arguments":[{"selector":"ccpay-payment-lib","template":"\n    <ccpay-payment-list *ngIf=\"viewName === 'payment-list'\"></ccpay-payment-list>\n    <ccpay-payment-view *ngIf=\"viewName === 'payment-view'\"\n    [isTurnOff]=\"ISTURNOFF\"></ccpay-payment-view>\n    <ccpay-case-transactions  *ngIf=\"viewName === 'case-transactions'\"></ccpay-case-transactions>\n    <app-mark-unidentified-payment *ngIf=\"viewName === 'unidentifiedPage'\"\n    [caseType]=\"CASETYPE\"></app-mark-unidentified-payment>\n    <app-mark-unsolicited-payment *ngIf=\"viewName === 'unsolicitedPage'\"\n    [caseType]=\"CASETYPE\"></app-mark-unsolicited-payment>\n    <app-allocate-payments *ngIf=\"viewName === 'allocate-payments'\"\n    [isTurnOff]=\"ISTURNOFF\"\n    [caseType]=\"CASETYPE\"\n    ></app-allocate-payments>\n    <ccpay-fee-summary *ngIf=\"viewName === 'fee-summary'\"\n      [ccdCaseNumber]=\"CCD_CASE_NUMBER\" \n      [paymentGroupRef]=\"paymentGroupReference\"\n      [isTurnOff]=\"ISTURNOFF\"\n      [caseType]=\"CASETYPE\"\n      [isOldPcipalOff]=\"ISOLDPCIPALOFF\"\n      [isNewPcipalOff]=\"ISNEWPCIPALOFF\"\n      ></ccpay-fee-summary>\n    <ccpay-reports *ngIf=\"viewName === 'reports'\"></ccpay-reports>\n    "}]}],"members":{"API_ROOT":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":32,"character":3},"arguments":["API_ROOT"]}]}],"BULKSCAN_API_ROOT":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":33,"character":3},"arguments":["BULKSCAN_API_ROOT"]}]}],"CCD_CASE_NUMBER":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":34,"character":3},"arguments":["CCD_CASE_NUMBER"]}]}],"EXC_REFERENCE":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":35,"character":3},"arguments":["EXC_REFERENCE"]}]}],"PAYMENT_METHOD":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":36,"character":3},"arguments":["PAYMENT_METHOD"]}]}],"VIEW":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":37,"character":3},"arguments":["VIEW"]}]}],"PAYMENT_GROUP_REF":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":38,"character":3},"arguments":["PAYMENT_GROUP_REF"]}]}],"TAKEPAYMENT":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":39,"character":3},"arguments":["TAKEPAYMENT"]}]}],"DCN_NUMBER":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":40,"character":3},"arguments":["DCN_NUMBER"]}]}],"SELECTED_OPTION":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":41,"character":3},"arguments":["SELECTED_OPTION"]}]}],"ISBSENABLE":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":42,"character":3},"arguments":["ISBSENABLE"]}]}],"ISSFENABLE":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":43,"character":3},"arguments":["ISSFENABLE"]}]}],"ISTURNOFF":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":44,"character":3},"arguments":["ISTURNOFF"]}]}],"CASETYPE":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":45,"character":3},"arguments":["CASETYPE"]}]}],"ISOLDPCIPALOFF":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":46,"character":3},"arguments":["ISOLDPCIPALOFF"]}]}],"ISNEWPCIPALOFF":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":47,"character":3},"arguments":["ISNEWPCIPALOFF"]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"PaymentLibService"}]}],"ngOnInit":[{"__symbolic":"method"}]}},"PaymentLibModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":31,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":33,"character":4},{"__symbolic":"reference","module":"@angular/common/http","name":"HttpClientModule","line":34,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":35,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"ReactiveFormsModule","line":36,"character":4}],"declarations":[{"__symbolic":"reference","name":"PaymentLibComponent"},{"__symbolic":"reference","name":"ɵa"},{"__symbolic":"reference","name":"ɵe"},{"__symbolic":"reference","name":"ɵh"},{"__symbolic":"reference","name":"ɵj"},{"__symbolic":"reference","name":"ɵk"},{"__symbolic":"reference","name":"ɵm"},{"__symbolic":"reference","name":"ɵo"},{"__symbolic":"reference","name":"ɵp"},{"__symbolic":"reference","name":"ɵq"},{"__symbolic":"reference","name":"ɵr"},{"__symbolic":"reference","name":"ɵt"},{"__symbolic":"reference","name":"ɵu"},{"__symbolic":"reference","name":"ɵv"},{"__symbolic":"reference","name":"ɵw"},{"__symbolic":"reference","name":"ɵx"},{"__symbolic":"reference","name":"ɵy"},{"__symbolic":"reference","name":"ɵz"},{"__symbolic":"reference","name":"ɵba"},{"__symbolic":"reference","name":"ɵbc"}],"exports":[{"__symbolic":"reference","name":"PaymentLibComponent"}],"providers":[{"provide":{"__symbolic":"reference","name":"ɵc"},"useClass":{"__symbolic":"reference","name":"ɵbd"}},{"__symbolic":"reference","name":"ɵbb"},{"__symbolic":"reference","name":"ɵg"}]}]}],"members":{}},"ɵa":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":7,"character":1},"arguments":[{"selector":"ccpay-payment-list","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 hh:mm:ss' }}</td>\n        <td class=\"font-xsmall\">{{ payment.channel | titlecase }}</td>\n        <td class=\"font-xsmall\">{{ payment.method | titlecase }}</td>\n        <td class=\"font-xsmall\">£{{ 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 “Cancel payment” 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":[""]}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ɵb"},{"__symbolic":"reference","name":"PaymentLibComponent"}]}],"ngOnInit":[{"__symbolic":"method"}],"loadPaymentViewComponent":[{"__symbolic":"method"}]}},"ɵb":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":10,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/common/http","name":"HttpClient","line":16,"character":28},{"__symbolic":"reference","name":"ɵc"},{"__symbolic":"reference","name":"ɵd"},{"__symbolic":"reference","name":"PaymentLibService"}]}],"getPaymentByCcdCaseNumber":[{"__symbolic":"method"}]},"statics":{"ngInjectableDef":{}}},"ɵc":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":11,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"invokeConsoleMethod":[{"__symbolic":"method"}]},"statics":{"ngInjectableDef":{}}},"ɵd":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":5,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor"}],"handleError":[{"__symbolic":"method"}],"getServerErrorMessage":[{"__symbolic":"method"}]},"statics":{"ngInjectableDef":{}}},"ɵe":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":7,"character":1},"arguments":[{"selector":"ccpay-payment-view","template":"<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=\"#\" (click)=\"goToCaseTransationPage($event)\" class=\"govuk-back-link\">Back</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\n        </h2>\n        <div class=\"govuk-error-summary__body\">\n          {{ errorMessage }}\n        </div>\n      </div>\n    </div>\n\n    <div class=\"payment-view-alignment\" *ngIf=\"!errorMessage && paymentGroup\">\n\n      <input #myInput type='hidden' id='iFrameDrivenImageValue' value='PAYMENTDETAILS'>\n      <div class=\"govuk-grid-row\">\n        <div class=\"column\">\n          <h1 class=\"heading-large govuk-!-margin-top-0\">Payment details</h1>\n        </div>\n      </div>\n      <table>\n        <tbody>\n      <tr class=\"section\" *ngIf=\"isTurnOff\">\n          <td class=\"bold tb-col-w\">Payment group reference</td>\n          <td>{{ paymentGroup.payment_group_reference }}</td>\n        </tr>\n        <tr class=\"section\">\n          <td class=\"bold tb-col-w\">Payment reference</td>\n          <td>{{ paymentGroup.payments[0].reference }}</td>\n        </tr>\n        <tr class=\"section\">\n          <td class=\"bold tb-col-w\">Payment amount</td>\n          <td>£{{ paymentGroup.payments[0].amount | number:'.2' }}</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</td>\n          <td>{{ paymentGroup.payments[0].external_reference }}</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(DCN)</td>\n          <td>{{ 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</td>\n          <td>{{ paymentGroup.payments[0].banked_date | date:'dd MMM yyyy' }}</td>\n        </tr>\n        </tbody>\n      </table>\n\n      <div class=\"govuk-grid-row\" *ngIf=\"paymentGroup.fees.length > 0\">\n        <div class=\"column\">\n          <h2 class=\"heading-large\">Fee and remission details</h2>\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</td>\n            <td>Application for {{ fee.description }}</td>\n          </tr>\n          <tr class=\"section\">\n            <td class=\"bold tb-col-w\">Fee code</td>\n            <td>{{ 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</td>\n            <td [ngClass]=\"{'tr-border': !fee.apportion_amount && !fee.remissions && !isTurnOff }\">£{{ fee.calculated_amount | number:'.2' }}</td>\n          </tr>\n          <tr *ngIf=\"fee.net_amount && isTurnOff\">\n            <td class=\"bold tb-col-w\" [ngClass]=\"{'tr-border': !fee.apportion_amount && !fee.remissions}\" >Net amount</td>\n            <td [ngClass]=\"{'tr-border': !fee.apportion_amount && !fee.remissions}\">£{{ fee.net_amount | number:'.2' }}</td>\n          </tr>\n          <tr *ngIf=\"fee.apportion_amount\">\n            <td class=\"bold tb-col-w tr-border\" [ngClass]=\"{'tr-border': !fee.remissions}\">Allocated amount</td>\n            <td [ngClass]=\"{'tr-border': !fee.remissions}\">£{{ fee.apportion_amount | number:'.2' }}</td>\n          </tr>\n\n          <tr *ngIf=\"fee.remissions\">\n            <td class=\"bold tb-col-w\">Remission code</td>\n            <td>{{fee.remissions.hwf_reference}}</td>\n          </tr>\n          <tr *ngIf=\"fee.remissions\">\n            <td class=\"bold tb-col-w tr-border\">Remission amount</td>\n            <td class=\"tr-border\">£{{ fee.remissions.hwf_amount | number:'.2'}}</td>\n          </tr>\n          </tbody>\n        </table>\n\n      </div>\n\n      <!-- card details -->\n      <ccpay-card-details *ngIf=\"isCardPayment && !isTelephonyPayment\"></ccpay-card-details>\n\n      <!-- pba details -->\n      <ccpay-pba-details *ngIf=\"!isCardPayment\" [payment]=\"paymentGroup.payments[0]\"></ccpay-pba-details>\n\n      <!-- Status histories -->\n      <ccpay-payment-statuses *ngIf=\"isStatusAllocated\"></ccpay-payment-statuses>\n\n    </div>\n\n  </main>\n</div>\n","styles":[".tb-col-w{width:330px}.tr-border{border-bottom:2px solid}.payment-view-alignment{margin-left:30px}"]}]}],"members":{"isTurnOff":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":129,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ɵf"},{"__symbolic":"reference","name":"PaymentLibComponent"}]}],"ngOnInit":[{"__symbolic":"method"}],"goToPaymentList":[{"__symbolic":"method"}],"goToCaseTransationPage":[{"__symbolic":"method"}]}},"ɵf":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":21,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/common/http","name":"HttpClient","line":28,"character":28},{"__symbolic":"reference","name":"ɵg"},{"__symbolic":"reference","name":"ɵc"},{"__symbolic":"reference","name":"ɵd"},{"__symbolic":"reference","name":"PaymentLibService"}]}],"getPaymentDetails":[{"__symbolic":"method"}],"getPaymentGroupDetails":[{"__symbolic":"method"}],"getApportionPaymentDetails":[{"__symbolic":"method"}],"postBSPayments":[{"__symbolic":"method"}],"postBSUnidentifiedPayments":[{"__symbolic":"method"}],"postBSUnsolicitedPayments":[{"__symbolic":"method"}],"postBSAllocationPayments":[{"__symbolic":"method"}],"postPaymentGroupWithRemissions":[{"__symbolic":"method"}],"deleteFeeFromPaymentGroup":[{"__symbolic":"method"}],"postPaymentToPayHub":[{"__symbolic":"method"}],"postPaymentAntennaToPayHub":[{"__symbolic":"method"}],"downloadSelectedReport":[{"__symbolic":"method"}],"getBSfeature":[{"__symbolic":"method"}],"getSiteID":[{"__symbolic":"method"}]},"statics":{"ngInjectableDef":{}}},"ɵg":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":5,"character":1}}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/common/http","name":"HttpClient","line":8,"character":18},{"__symbolic":"reference","module":"@angular/platform-browser","name":"Meta","line":9,"character":18}]}],"post":[{"__symbolic":"method"}],"put":[{"__symbolic":"method"}],"get":[{"__symbolic":"method"}],"delete":[{"__symbolic":"method"}],"patch":[{"__symbolic":"method"}],"addHeaders":[{"__symbolic":"method"}]}},"ɵh":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":5,"character":1},"arguments":[{"selector":"ccpay-card-details","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}"]}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ɵi"},{"__symbolic":"reference","name":"PaymentLibComponent"}]}],"ngOnInit":[{"__symbolic":"method"}]}},"ɵi":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":11,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/common/http","name":"HttpClient","line":16,"character":28},{"__symbolic":"reference","name":"ɵc"},{"__symbolic":"reference","name":"ɵd"},{"__symbolic":"reference","name":"PaymentLibService"}]}],"getCardDetails":[{"__symbolic":"method"}]},"statics":{"ngInjectableDef":{}}},"ɵj":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":2,"character":1},"arguments":[{"template":"\n    <h1>This is not the page you were looking for!</h1>\n    "}]}],"members":{}},"ɵk":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":5,"character":1},"arguments":[{"selector":"ccpay-payment-statuses","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>Amount</th>\n          <th>Date</th>\n        </tr>\n      </thead> \n      <tbody>\n        <tr *ngFor=\"let status of statuses.status_histories\">\n          <td>{{ status.status }}</td>\n          <td>£{{ statuses.amount | number:'.2' }}</td>\n          <td>{{ status.date_created | date:'dd MMM yyyy hh:mm:ss'}}</td>\n        </tr>\n    </tbody>\n  </table>\n</div>\n","styles":[""]}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ɵl"},{"__symbolic":"reference","name":"PaymentLibComponent"}]}],"ngOnInit":[{"__symbolic":"method"}]}},"ɵl":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":10,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/common/http","name":"HttpClient","line":15,"character":28},{"__symbolic":"reference","name":"ɵc"},{"__symbolic":"reference","name":"ɵd"},{"__symbolic":"reference","name":"PaymentLibService"}]}],"getPaymentStatusesByReference":[{"__symbolic":"method"}]},"statics":{"ngInjectableDef":{}}},"ɵm":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":9,"character":1},"arguments":[{"selector":"app-mark-unidentified-payment","template":"<div class=\"mkpay-unidentified\" >\n  <div *ngIf=\"viewStatus === 'mainForm'\">\n    <input #myInput  type='hidden' id='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' id='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' id='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:#a71414 solid 3px;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}"]}]}],"members":{"caseType":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":127,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/forms","name":"FormBuilder","line":145,"character":35},{"__symbolic":"reference","name":"ɵf"},{"__symbolic":"reference","name":"PaymentLibComponent"},{"__symbolic":"reference","name":"ɵn"}]}],"ngOnInit":[{"__symbolic":"method"}],"getUnassignedPayment":[{"__symbolic":"method"}],"trimUnderscore":[{"__symbolic":"method"}],"saveAndContinue":[{"__symbolic":"method"}],"resetForm":[{"__symbolic":"method"}],"confirmPayments":[{"__symbolic":"method"}],"cancelMarkUnidentifiedPayments":[{"__symbolic":"method"}],"gotoCasetransationPage":[{"__symbolic":"method"}],"getErrorMessage":[{"__symbolic":"method"}]}},"ɵn":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":12,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/common/http","name":"HttpClient","line":17,"character":28},{"__symbolic":"reference","name":"ɵg"},{"__symbolic":"reference","name":"ɵd"},{"__symbolic":"reference","name":"PaymentLibService"}]}],"getBSPaymentsByCCD":[{"__symbolic":"method"}],"getBSPaymentsByDCN":[{"__symbolic":"method"}],"postBSAllocatePayment":[{"__symbolic":"method"}],"postBSPaymentStrategic":[{"__symbolic":"method"}],"postBSWoPGStrategic":[{"__symbolic":"method"}],"patchBSChangeStatus":[{"__symbolic":"method"}],"calculateOutStandingAmount":[{"__symbolic":"method"}],"removeUnwantedString":[{"__symbolic":"method"}],"downloadSelectedReport":[{"__symbolic":"method"}]},"statics":{"ngInjectableDef":{}}},"ɵo":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":11,"character":1},"arguments":[{"selector":"app-mark-unsolicited-payment","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' id='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' id='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' id='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:#a71414 solid 3px;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:#fff}select option{background:#fff}"]}]}],"members":{"caseType":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":137,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/forms","name":"FormBuilder","line":164,"character":35},{"__symbolic":"reference","name":"ɵf"},{"__symbolic":"reference","name":"PaymentLibComponent"},{"__symbolic":"reference","name":"ɵn"}]}],"ngOnInit":[{"__symbolic":"method"}],"trimUnderscore":[{"__symbolic":"method"}],"confirmPayments":[{"__symbolic":"method"}],"saveAndContinue":[{"__symbolic":"method"}],"resetForm":[{"__symbolic":"method"}],"cancelMarkUnsolicitedPayments":[{"__symbolic":"method"}],"checkingFormValue":[{"__symbolic":"method"}],"gotoCasetransationPage":[{"__symbolic":"method"}],"getUnassignedPayment":[{"__symbolic":"method"}],"getErrorMessage":[{"__symbolic":"method"}],"selectchange":[{"__symbolic":"method"}]}},"ɵp":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":6,"character":1},"arguments":[{"selector":"ccpay-app-unprocessed-payments","template":"<div class=\"unprocessed-payments govuk-grid-column-full govuk-!-padding-bottom-3\">\n  <input #myInput type='hidden' id='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\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:transparent solid 1px;outline-offset:-1px;-webkit-appearance:none;box-shadow:0 2px 0 #003618}.button.disabled,.button[disabled=disabled],.button[disabled]{zoom:1;opacity:.5}.button.disabled:active,.button[disabled=disabled]:active,.button[disabled]:active{top:0;box-shadow:0 2px 0 #003618}.button[disabled=disabled]{background:#00823b}.lowercase{text-transform:lowercase}.capitalize::first-letter{text-transform:uppercase}.whitespace-inherit{white-space:inherit!important}"]}]}],"members":{"FEE_RECORDS_EXISTS":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":102,"character":3},"arguments":["FEE_RECORDS_EXISTS"]}]}],"PAYMENTREF":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":103,"character":3},"arguments":["PAYMENTREF"]}]}],"ISTURNOFF":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":104,"character":3},"arguments":["ISTURNOFF"]}]}],"IS_BUTTON_ENABLE":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":105,"character":3},"arguments":["IS_BUTTON_ENABLE"]}]}],"IS_OS_AMT_AVAILABLE":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":106,"character":3},"arguments":["IS_OS_AMT_AVAILABLE"]}]}],"ISNEWPCIPALOFF":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":107,"character":3},"arguments":["ISNEWPCIPALOFF"]}]}],"ISOLDPCIPALOFF":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":108,"character":3},"arguments":["ISOLDPCIPALOFF"]}]}],"ISSFENABLE":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":109,"character":3},"arguments":["ISSFENABLE"]}]}],"selectedUnprocessedFeeEvent":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":111,"character":3}}]}],"getUnprocessedFeeCount":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":112,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"Router","line":134,"character":30},{"__symbolic":"reference","name":"ɵn"},{"__symbolic":"reference","name":"PaymentLibComponent"}]}],"ngOnInit":[{"__symbolic":"method"}],"getUnassignedPaymentlist":[{"__symbolic":"method"}],"setValuesForUnassignedRecord":[{"__symbolic":"method"}],"formatUnassignedRecordId":[{"__symbolic":"method"}],"trimUnderscore":[{"__symbolic":"method"}],"redirectToFeeSearchPage":[{"__symbolic":"method"}],"loadUnsolicitedPage":[{"__symbolic":"method"}],"unprocessedPaymentSelectEvent":[{"__symbolic":"method"}],"goToAllocatePage":[{"__symbolic":"method"}],"validateButtons":[{"__symbolic":"method"}],"unprocessedPaymentUnSelectEvent":[{"__symbolic":"method"}]}},"ɵq":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":5,"character":1},"arguments":[{"selector":"ccpay-app-processed-payments","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}"]}]}],"members":{"NONPAYMENTS":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":45,"character":3},"arguments":["NONPAYMENTS"]}]}],"goToPaymentViewComponent":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":46,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"Router","line":49,"character":20},{"__symbolic":"reference","name":"ɵn"}]}],"ngOnInit":[{"__symbolic":"method"}],"trimUnderscore":[{"__symbolic":"method"}],"redirectToPaymentViewPage":[{"__symbolic":"method"}]}},"ɵr":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":12,"character":1},"arguments":[{"selector":"app-allocate-payments","template":"<div class=\"allocate-payments\">\n  <div *ngIf=\"viewStatus==='mainForm' && isTurnOff\">\n    <input #myInput type='hidden' id='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' id='iFrameDrivenImageValue' value='{{feedbackUrlLabel}}'>\n    <h1 class=\"govuk-heading-xl\">Confirm association</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                [(ngModel)]=\"paymentReason\" value={{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                [(ngModel)]=\"paymentReason\" value={{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                [(ngModel)]=\"paymentExplanation\" value={{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\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                [(ngModel)]=\"paymentExplanation\" value={{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>","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-font__custom,.allocate-payments .govuk-heading-m--custom,.allocate-payments .govuk-hint,.allocate-payments .govuk-label--m,.allocate-payments .govuk-list__custom,.allocate-payments .govuk-radios__item,.allocate-payments .govuk-warning-text__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:#a71414 solid 3px;outline-offset:0}.allocate-payments .inline-error-message{color:#a71414;font-weight:700;margin-top:10px}.allocate-payments .inline-error-border{border-color:#a71414}"]}]}],"members":{"isTurnOff":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":232,"character":3}}]}],"caseType":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":233,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ɵd"},{"__symbolic":"reference","name":"ɵs"},{"__symbolic":"reference","module":"@angular/forms","name":"FormBuilder","line":310,"character":23},{"__symbolic":"reference","name":"ɵf"},{"__symbolic":"reference","name":"PaymentLibComponent"},{"__symbolic":"reference","name":"ɵn"}]}],"ngOnInit":[{"__symbolic":"method"}],"getGroupOutstandingAmount":[{"__symbolic":"method"}],"getPaymentGroupDetails":[{"__symbolic":"method"}],"selectedPaymentGroup":[{"__symbolic":"method"}],"gotoCasetransationPage":[{"__symbolic":"method"}],"gotoSummaryPage":[{"__symbolic":"method"}],"cancelAllocatePayment":[{"__symbolic":"method"}],"confirmAllocatePayement":[{"__symbolic":"method"}],"resetForm":[{"__symbolic":"method"}],"finalServiceCall":[{"__symbolic":"method"}],"saveAndContinue":[{"__symbolic":"method"}],"getUnassignedPayment":[{"__symbolic":"method"}],"selectRadioButton":[{"__symbolic":"method"}]}},"ɵs":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":9,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/common/http","name":"HttpClient","line":14,"character":28},{"__symbolic":"reference","name":"ɵc"},{"__symbolic":"reference","name":"ɵd"},{"__symbolic":"reference","name":"PaymentLibService"}]}],"getPaymentGroups":[{"__symbolic":"method"}]},"statics":{"ngInjectableDef":{}}},"ɵt":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":3,"character":1},"arguments":[{"selector":"ccpay-pba-details","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}"]}]}],"members":{"payment":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":35,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}]}},"ɵu":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":12,"character":1},"arguments":[{"selector":"ccpay-case-transactions","template":"<div class=\"govuk-width-container\">\n\n  <main class=\"govuk-main-wrapper\">\n    <div *ngIf=\"viewStatus === 'main'&& !isTurnOff && takePayment\">\n\n\n    <div   *ngIf=\"takePayment\" class=\"govuk-grid-row\">\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\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      <ccpay-app-unprocessed-payments\n      *ngIf=\"isBulkScanEnable\"\n      [IS_BUTTON_ENABLE]=\"takePayment\"\n      [FEE_RECORDS_EXISTS]=\"isAnyFeeGroupAvilable\"\n      [ISTURNOFF]=\"isTurnOff\"\n      [ISSFENABLE]=\"isStrategicFixEnable\"\n      [PAYMENTREF]=\"paymentRef\"\n      [ISNEWPCIPALOFF]=\"isNewPcipalOff\"\n      [ISOLDPCIPALOFF]=\"isOldPcipalOff\"\n      (getUnprocessedFeeCount) = \"getUnprocessedFeeCount($event)\"\n      (selectedUnprocessedFeeEvent) = \"selectedUnprocessedFeeEvent($event)\">\n      </ccpay-app-unprocessed-payments>\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.fee_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 HH:mm:ss' }}</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 HH:mm:ss' }}</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    <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.fee_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 HH:mm:ss' }}</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 yyyy HH:mm:ss' }}</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      [ISTURNOFF]=\"isTurnOff\"\n      [ISNEWPCIPALOFF]=\"isNewPcipalOff\"\n      [ISOLDPCIPALOFF]=\"isOldPcipalOff\"\n      [ISSFENABLE]=\"isStrategicFixEnable\"\n      [FEE_RECORDS_EXISTS]=\"isFeeRecordsExist\" \n      [IS_OS_AMT_AVAILABLE]=\"isGrpOutstandingAmtPositive\" \n      (selectedUnprocessedFeeEvent) = \"selectedUnprocessedFeeEvent($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  <ccpay-app-unprocessed-payments\n  *ngIf=\"isBulkScanEnable && !takePayment\"\n  [IS_BUTTON_ENABLE]=\"takePayment\"\n  [ISTURNOFF]=\"isTurnOff\"\n  [ISSFENABLE]=\"isStrategicFixEnable\"\n  [FEE_RECORDS_EXISTS]=\"isFeeRecordsExist\" \n  [IS_OS_AMT_AVAILABLE]=\"isGrpOutstandingAmtPositive\" \n  (selectedUnprocessedFeeEvent) = \"selectedUnprocessedFeeEvent($event)\">\n</ccpay-app-unprocessed-payments>\n\n<div *ngIf=\"!takePayment\" class=\"govuk-grid-row govuk-grid__surplus-payments\">\n      <div class=\"govuk-grid-column-full\">\n    <span class=\"heading-medium\">Processed 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\">Date updated</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=\"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 HH:mm:ss' }}</td>\n            <td class=\"govuk-table__cell whitespace-inherit\">{{ payment.date_updated | date:'dd MMM yyyy HH:mm:ss' }}</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=\"allPayments?.length === 0\">\n        <td class=\"govuk-table__cell\" colspan=\"8\">No payments recorded</td>\n      </tbody>\n    </table>\n</div>\n</div>\n\n<input #myInput type='hidden' id='iFrameDrivenImageValue' value='FEEREMOVALCONFIRMATION_2'>\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>","styles":[".govuk-grid-column-full--gr{position:relative;margin-bottom:10px}.disable{text-decoration:none;cursor:default;color:#fff;background-color:grey;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:0}.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 #000}.totalpayments.govuk-table__row{border-bottom:2px solid #000!important}.govuk-inset-text{margin-left:1em}.govuk-button{font-size:19px}.govuk-table__cell.govuk-table__cell--col6.govuk-table__custom--col6,.groupamount.govuk-table__header{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 #000!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%}.col-15{width:15%}.hmcts-banner>.hmcts-banner__message{font-size:19px;line-height:1.25}.summary-table-font{font-size:36px}"]}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"Router","line":523,"character":30},{"__symbolic":"reference","name":"ɵf"},{"__symbolic":"reference","name":"ɵn"},{"__symbolic":"reference","name":"ɵs"},{"__symbolic":"reference","name":"PaymentLibComponent"}]}],"ngOnInit":[{"__symbolic":"method"}],"setDefaults":[{"__symbolic":"method"}],"getAllocationStatus":[{"__symbolic":"method"}],"checkForExceptionRecord":[{"__symbolic":"method"}],"calculateAmounts":[{"__symbolic":"method"}],"calculateRefundAmount":[{"__symbolic":"method"}],"getGroupOutstandingAmount":[{"__symbolic":"method"}],"redirectToFeeSearchPage":[{"__symbolic":"method"}],"redirectToReportsPage":[{"__symbolic":"method"}],"loadFeeSummaryPage":[{"__symbolic":"method"}],"goToPaymentViewComponent":[{"__symbolic":"method"}],"goToPayementView":[{"__symbolic":"method"}],"selectedUnprocessedFeeEvent":[{"__symbolic":"method"}],"getUnprocessedFeeCount":[{"__symbolic":"method"}],"calculateAmountDue":[{"__symbolic":"method"}],"confirmRemoveFee":[{"__symbolic":"method"}],"cancelRemoval":[{"__symbolic":"method"}],"removeFee":[{"__symbolic":"method"}],"isCheckAmountdueExist":[{"__symbolic":"method"}]}},"ɵv":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":15,"character":1},"arguments":[{"selector":"ccpay-fee-summary","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' id='iFrameDrivenImageValue' value='FEESUMMARY'>\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     <div class=\"govuk-grid-column-one-third\" align=\"right\">\n            <button  *ngIf=\"!isTurnOff\" (click)=\"redirectToFeeSearchPage($event,'summary')\"\n            [disabled]=\"isPaymentExist\"\n            [ngClass]='isPaymentExist ? \"button button--disabled govuk-!-margin-right-1\" : \"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>\t\n    </div>\n  </div>\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        Payment Group details could not be retrieved\n      </h2>\n      <div class=\"govuk-error-summary__body\">\n        {{ errorMessage }}\n      </div>\n    </div>\n  </div>\n\n  <table class=\"govuk-table\"  *ngIf=\"!errorMessage && paymentGroup\">\n    <thead class=\"govuk-table__head\">\n      <tr class=\"govuk-table__row\">\n        <th class=\"govuk-table__header govuk-!-font-weight-bold\" scope=\"col\">Fee Code</th>\n        <th class=\"govuk-table__header govuk-!-font-weight-bold\" scope=\"col\">Fee description</th>\n        <th class=\"govuk-table__header govuk-!-font-weight-bold\" scope=\"col\">Remission code</th>\n        <th class=\"govuk-table__header govuk-!-font-weight-bold\" scope=\"col\"></th>\n      </tr>\n    </thead>\n    <tbody class=\"govuk-table__body\" *ngIf=\"paymentGroup.fees\">\n      <tr class=\"govuk-table__row\" *ngFor=\"let fee of paymentGroup.fees; let i = index;\">\n        <td class=\"govuk-table__cell\">{{ fee.code }}</td>\n        <td class=\"govuk-table__cell\">{{ fee.description }}</td>\n        <td class=\"govuk-table__cell\">{{ getRemissionByFeeCode(fee.code)?.hwf_reference }}</td>\n        <td class=\"govuk-table__cell grey-text\">\n          <table class=\"govuk-table\">\n            <tr class=\"govuk-table__row\">\n              <td class=\"no-border grey-text subcolumn-1\">Fee amount:</td>\n              <td class=\"no-border subcolumn-2\">{{ fee.fee_amount | currency:'GBP':'symbol-narrow':'1.2-2' }}</td>\n              <td class=\"no-border subcolumn-3\" *ngIf=\"!isTurnOff\">\n                <a (click)=\"confirmRemoveFee(fee.id)\" [ngClass]='isPaymentExist || fee.remissions ? \"disable-link\" : \"\"'>remove fee</a>\n              </td>\n              <td class=\"no-border subcolumn-3\" *ngIf=\"isTurnOff\">\n                <a (click)=\"confirmRemoveFee(fee.id)\">remove fee</a>\n              </td>\n            </tr>\n            <tr class=\"govuk-table__row\" *ngIf=\"fee.volume && fee.volume > 0\">\n              <td class=\"no-border grey-text subcolumn-1\">Volume:</td>\n              <td class=\"no-border subcolumn-2\">{{ fee.volume }}</td>\n              <td class=\"no-border subcolumn-3\"></td>\n            </tr>\n            <tr class=\"govuk-table__row\">\n              <td class=\"no-border grey-text subcolumn-1\">Fee total:</td>\n              <td class=\"no-border subcolumn-2\">{{ fee.calculated_amount  | currency:'GBP':'symbol-narrow':'1.2-2' }}</td>\n              <td class=\"no-border subcolumn-3\"></td>\n            </tr>\n            <tr class=\"govuk-table__row\">\n              <td class=\"no-border grey-text subcolumn-1\">Remission amount:</td>\n              <td class=\"no-border subcolumn-2\">{{ getRemissionByFeeCode(fee.code)?.hwf_amount? ( getRemissionByFeeCode(fee.code)?.hwf_amount  | currency:'GBP':'symbol-narrow':'1.2-2') : '-' }}</td>\n              <td class=\"no-border subcolumn-3\" *ngIf=\"!isTurnOff\"> \n                <a (click)=\"addRemission(fee)\" *ngIf=\"(getRemissionByFeeCode(fee.code)?.hwf_amount === 0 || !getRemissionByFeeCode(fee.code)?.hwf_amount) && !isPaymentExist\">\n                  Deduct remission\n                </a>\n              </td>\n              <td class=\"no-border subcolumn-3\" *ngIf=\"isTurnOff\"> \n                <a (click)=\"addRemission(fee)\" *ngIf=\"getRemissionByFeeCode(fee.code)?.hwf_amount === 0 || !getRemissionByFeeCode(fee.code)?.hwf_amount\">\n                Deduct remission\n              </a>\n              </td>\n                        </tr>\n            <tr class=\"govuk-table__row\">\n              <td class=\"no-border grey-text subcolumn-1\">Total after remission:</td>\n              <td class=\"no-border subcolumn-2\">{{ fee.net_amount  | currency:'GBP':'symbol-narrow':'1.2-2' }}</td>\n              <td class=\"no-border subcolumn-3\"></td>\n            </tr>\n          </table>\n        </td>\n      </tr>\n      <tr class=\"govuk-table__row\">\n        <td class=\"no-border\"></td>\n        <td class=\"no-border\"></td>\n        <td class=\"no-border\"></td>\n        <td class=\"no-border\">\n          <table class=\"govuk-table\">\n            <tr class=\"govuk-table__row\">\n              <td class=\"no-border govuk-!-font-weight-bold subcolumn-1\">Total payment</td>\n              <td class=\"no-border subcolumn-2\">{{ totalAfterRemission - outStandingAmount | currency:'GBP':'symbol-narrow':'1.2-2'}}</td>\n              <td class=\"no-border subcolumn-3\"></td>\n            </tr>\n            <tr class=\"govuk-table__row\">\n              <td class=\"no-border govuk-!-font-weight-bold subcolumn-1\">Total outstanding amount</td>\n              <td class=\"no-border subcolumn-2\">{{ outStandingAmount | currency:'GBP':'symbol-narrow':'1.2-2'}}</td>\n              <td class=\"no-border subcolumn-3\"></td>\n            </tr>\n          </table>\n        </td>\n      </tr>\n      <tr class=\"govuk-table__row\" *ngIf=\"!bsPaymentDcnNumber && isOldPcipalOff && isNewPcipalOff\">\n        <td class=\"no-border\"></td>\n        <td class=\"no-border\"></td>\n        <td class=\"no-border\"></td>\n        <td class=\"no-border\">\n          <div class=\"govuk-form-group govuk-form-group--mg\">\n            <fieldset class=\"govuk-fieldset\">\n              <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">\n                <span class=\"govuk-fieldset__heading govuk-fieldset__heading--fz\">\n                  Which system are you using to take the payment?\n                </span>\n              </legend>\n              <div class=\"govuk-radios govuk-radios--small\">\n                <div class=\"govuk-radios__item\">\n                  <input id=\"changed-name\" class=\"govuk-radios__input\" [(ngModel)]=\"platForm\" type=\"radio\" aria-label=\"8x8\" value=\"8x8\">\t\n                  <label class=\"govuk-label govuk-radios__label\" for=\"changed-name\">\t\n                    8x8\t\n                  </label>\t\n                </div>\t\n                <div class=\"govuk-radios__item\">\t\n                  <input id=\"changed-name-2\" class=\"govuk-radios__input\" [(ngModel)]=\"platForm\" type=\"radio\" aria-label=\"Antenna\" value=\"Antenna\">\t\n                  <label class=\"govuk-label govuk-radios__label\" for=\"changed-name-2\">\t\n                    Antenna\t\n                  </label>\t\n                </div>\t\n              </div>\t\n            </fieldset>\n          </div>\n        </td>\n      </tr>\n    </tbody>\n    <tr class=\"govuk-table__row\">\n      <td class=\"no-border\"></td>\n      <td class=\"no-border\"></td>\n      <td class=\"no-border\"></td>\n      <td class=\"no-border\">\n          <table class=\"govuk-table\">\n            <tr class=\"govuk-table__row\">\n              <td class=\"no-border subcolumn-2\"> \n                <button *ngIf=\"!bsPaymentDcnNumber\" type=\"submit\" (click)=\"takePayment()\"\n                [disabled]=\"totalFee <= 0 || !platForm || isConfirmationBtnDisabled\"\n                [ngClass]='totalFee <= 0 || !platForm || 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 *ngIf=\"outStandingAmount > 0 || (isFeeAmountZero && outStandingAmount === 0)\">\n                  Allocate payment\n                </span>\n                <span *ngIf=\"outStandingAmount < 0 || (!isFeeAmountZero && outStandingAmount === 0)\">\n                  Continue\n                </span>\n              </button>\n              </td>\n            </tr>\n          </table>\n      </td>\n    </tr>\n  </tbody>\n  </table>\n</main>\n</div>\n\n  <ng-container *ngIf=\"viewStatus === 'feeRemovalConfirmation'\">\n    <input #myInput type='hidden' id='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          [disabled]=\"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 [isOldPcipalOff]=\"isOldPcipalOff\" \n [isNewPcipalOff]=\"isNewPcipalOff\" \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' id='iFrameDrivenImageValue' value='PCIPAL'>\n<div *ngIf=\"viewStatus === 'payhub_view' && payhubHtml\" [innerHTML]=\"payhubHtml | sanitizeHtml\" id=\"payhub-html-id\"></div>\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 td,.fee-summary table th{font-size:15px;font-weight:500;vertical-align:top;max-width:320px}.fee-summary table td .no-padding,.fee-summary table th .no-padding{padding:0}.fee-summary table td .subcolumn-1,.fee-summary table th .subcolumn-1{width:45%}.fee-summary table td .subcolumn-2,.fee-summary table th .subcolumn-2{width:25%;text-align:right}.fee-summary table td .subcolumn-3,.fee-summary table th .subcolumn-3{width:30%;text-align:center}.govuk-button-grb{padding-bottom:20px}.govuk-button-grb .govuk-button--secondary{background-color:#dee0e2;box-shadow:0 2px 0 #858688;color:#0b0c0c;margin-right:10px}.govuk-form-group--mg{margin-top:10px!important}.govuk-fieldset__heading--fz{font-size:16px}.remissionDisable{color:grey;cursor:default}.heading-xlarge{margin:0 0 14px -20px}.govuk-select--custom{width:50%}.disable-link{cursor:default;pointer-events:none;color:#8e8c8c}"]}]}],"members":{"paymentGroupRef":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":239,"character":3}}]}],"ccdCaseNumber":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":240,"character":3}}]}],"isTurnOff":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":241,"character":3}}]}],"caseType":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":242,"character":3}}]}],"isOldPcipalOff":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":243,"character":3}}]}],"isNewPcipalOff":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":244,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"Router","line":270,"character":20},{"__symbolic":"reference","name":"ɵn"},{"__symbolic":"reference","module":"@angular/common","name":"Location","line":272,"character":22},{"__symbolic":"reference","name":"ɵf"},{"__symbolic":"reference","name":"PaymentLibComponent"}]}],"ngOnInit":[{"__symbolic":"method"}],"getUnassignedPaymentlist":[{"__symbolic":"method"}],"getRemissionByFeeCode":[{"__symbolic":"method"}],"addRemission":[{"__symbolic":"method"}],"getPaymentGroup":[{"__symbolic":"method"}],"confirmRemoveFee":[{"__symbolic":"method"}],"removeFee":[{"__symbolic":"method"}],"loadCaseTransactionPage":[{"__symbolic":"method"}],"cancelRemission":[{"__symbolic":"method"}],"redirectToFeeSearchPage":[{"__symbolic":"method"}],"takePayment":[{"__symbolic":"method"}],"goToAllocatePage":[{"__symbolic":"method"}],"isCheckAmountdueExist":[{"__symbolic":"method"}]}},"ɵw":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":10,"character":1},"arguments":[{"selector":"ccpay-add-remission","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  <ng-container *ngIf=\"viewStatus === 'main'\">\n      <input #myInput type='hidden' id='iFrameDrivenImageValue' value='ADDREMISSION'>\n      <h1 class=\"heading-large\">Add remission</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 {{ fee.code }}:{{ fee.description }}\n                <span class=\"form-hint\">Enter remission for reference. For example: HWF-A1B-23C</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</span>\n                <span *ngIf=\"remissionCodeHasError\">Enter a vaild remission code</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?\n              </label>\n\n              <div id=\"amount-currency\" class=\"govuk-visually-hidden\">in pounds</div>\n                <div class=\"hmcts-currency-input\">\n                <div class=\"hmcts-currency-input__symbol\" aria-hidden=\"true\">£</div>\n                <input class=\"govuk-input govuk-input--width-10\" [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</span>\n                  <span *ngIf=\"amountHasError\">Enter a vaild amount</span>\n                  <span *ngIf=\"isRemissionLessThanFeeError\">The remission amount must be less than the total fee</span>\n                </p>\n              </div>\n            </div>\n          </form>\n          <button class=\"button\" type=\"submit\" (click)=\"addRemission()\">\n              Submit\n            </button>\n        </div>\n      </form>\n  </ng-container>\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</span>\n          Are you sure you want to add remission to this fee?\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:</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:</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:</td>\n            <td class=\"govuk-table__cell\">{{ fee.description }}</td>\n        </tr>\n        <tr class=\"govuk-table__row\">\n            <td class=\"govuk-table__cell govuk-!-font-weight-bold\">Amount the applicant must pay:</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\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\n      </button>\n\n    </ng-container>\n\n</div>\n\n","styles":[".add-remission .button{margin:20px 2px}.add-remission td.govuk-table__cell{width:50%}.add-remission .govuk-button--secondary{background-color:#dee0e2;box-shadow:0 2px 0 #858688;color:#0b0c0c;margin-right:.5em}.add-remission .govuk-label--s,.add-remission .govuk-warning-text__text,.add-remission .hmcts-currency-input__symbol{font-size:19px}.add-remission .inline-error-class{outline:#a71414 solid 3px;outline-offset:0}.add-remission .inline-error-message{color:#a71414;font-weight:700;margin-top:10px}"]}]}],"members":{"fee":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":109,"character":3}}]}],"ccdCaseNumber":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":110,"character":3}}]}],"caseType":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":111,"character":3}}]}],"paymentGroupRef":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":112,"character":3}}]}],"isTurnOff":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":113,"character":3}}]}],"isOldPcipalOff":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":114,"character":3}}]}],"isNewPcipalOff":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":115,"character":3}}]}],"isStrategicFixEnable":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":116,"character":3}}]}],"cancelRemission":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":117,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/forms","name":"FormBuilder","line":133,"character":35},{"__symbolic":"reference","module":"@angular/router","name":"Router","line":134,"character":20},{"__symbolic":"reference","name":"ɵf"},{"__symbolic":"reference","name":"PaymentLibComponent"}]}],"ngOnInit":[{"__symbolic":"method"}],"addRemission":[{"__symbolic":"method"}],"resetRemissionForm":[{"__symbolic":"method"}],"confirmRemission":[{"__symbolic":"method"}],"gotoCasetransationPage":[{"__symbolic":"method"}]}},"ɵx":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Pipe","line":1,"character":1},"arguments":[{"name":"ccdHyphens"}]}],"members":{"__ctor__":[{"__symbolic":"constructor"}],"transform":[{"__symbolic":"method"}]}},"ɵy":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Pipe","line":1,"character":1},"arguments":[{"name":"keyValue"}]}],"members":{"__ctor__":[{"__symbolic":"constructor"}],"transform":[{"__symbolic":"method"}]}},"ɵz":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Pipe","line":3,"character":1},"arguments":[{"name":"sanitizeHtml"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/platform-browser","name":"DomSanitizer","line":5,"character":33}]}],"transform":[{"__symbolic":"method"}]}},"ɵba":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":9,"character":1},"arguments":[{"selector":"ccpay-reports","template":"<div class=\"header\">\n      <input #myInput type='hidden' id='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 ‘Unidentified’ or ‘Transferred’ (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       \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\">\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   </p>\n    <div class=\"btnsubmit\">\n     <button type=\"submit\" (click)=\"downloadReport()\" class=\"button\" [disabled]=\"!reportsForm.valid || isDownLoadButtondisabled || isStartDateLesthanEndDate || isDateRangeBetnWeek\">Download report</button>\n   </div>\n </form>\n    \n","styles":[".govuk-radios__input:focus+.govuk-radios__label::before{border-width:4px;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}"]}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ɵbb"},{"__symbolic":"reference","name":"ɵd"},{"__symbolic":"reference","module":"@angular/forms","name":"FormBuilder","line":118,"character":25},{"__symbolic":"reference","name":"ɵn"},{"__symbolic":"reference","name":"ɵf"}]}],"ngOnInit":[{"__symbolic":"method"}],"getToday":[{"__symbolic":"method"}],"getSelectedFromDate":[{"__symbolic":"method"}],"validateDates":[{"__symbolic":"method"}],"fromValidation":[{"__symbolic":"method"}],"downloadReport":[{"__symbolic":"method"}],"getFileName":[{"__symbolic":"method"}],"tranformDate":[{"__symbolic":"method"}],"getTwodigit":[{"__symbolic":"method"}],"getCamelCaseString":[{"__symbolic":"method"}],"applyDateFormat":[{"__symbolic":"method"}],"convertToFloatValue":[{"__symbolic":"method"}]}},"ɵbb":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":9,"character":1}}],"members":{"__ctor__":[{"__symbolic":"constructor"}],"exportAsExcelFile":[{"__symbolic":"method"}],"autoFitColumns":[{"__symbolic":"method"}],"setDataLossReportHeaders":[{"__symbolic":"method"}],"setUnprocessedReportHeaders":[{"__symbolic":"method"}],"setProcessedUnallocatedReportHeaders":[{"__symbolic":"method"}],"setShortFallReportHeaders":[{"__symbolic":"method"}],"saveAsExcelFile":[{"__symbolic":"method"}]}},"ɵbc":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":4,"character":1},"arguments":[{"selector":"ccpay-error-banner","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}"]}]}],"members":{"errorMessage":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":22,"character":3},"arguments":["errorMessage"]}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}]}},"ɵbd":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":7,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"invokeConsoleMethod":[{"__symbolic":"method"}]},"statics":{"ngInjectableDef":{}}}},"origins":{"PaymentLibService":"./lib/payment-lib.service","PaymentLibComponent":"./lib/payment-lib.component","PaymentLibModule":"./lib/payment-lib.module","ɵa":"./lib/components/payment-list/payment-list.component","ɵb":"./lib/services/payment-list/payment-list.service","ɵc":"./lib/services/shared/logger/logger.service","ɵd":"./lib/services/shared/error-handler.service","ɵe":"./lib/components/payment-view/payment-view.component","ɵf":"./lib/services/payment-view/payment-view.service","ɵg":"./lib/services/shared/httpclient/webcomponent.http.client","ɵh":"./lib/components/card-details/card-details.component","ɵi":"./lib/services/card-details/card-details.service","ɵj":"./lib/components/page-not-found.component","ɵk":"./lib/components/status-history/status-history.component","ɵl":"./lib/services/status-history/status-history.service","ɵm":"./lib/components/mark-unidentified-payment/mark-unidentified-payment.component","ɵn":"./lib/services/bulk-scaning-payment/bulk-scaning-payment.service","ɵo":"./lib/components/mark-unsolicited-payment/mark-unsolicited-payment.component","ɵp":"./lib/components/unprocessed-payments/unprocessed-payments.component","ɵq":"./lib/components/processed-payments/processed-payments.component","ɵr":"./lib/components/allocate-payments/allocate-payments.component","ɵs":"./lib/services/case-transactions/case-transactions.service","ɵt":"./lib/components/pba-details/pba-details.component","ɵu":"./lib/components/case-transactions/case-transactions.component","ɵv":"./lib/components/fee-summary/fee-summary.component","ɵw":"./lib/components/add-remission/add-remission.component","ɵx":"./lib/pipes/ccd-hyphens.pipe","ɵy":"./lib/pipes/key-value.pipe","ɵz":"./lib/pipes/sanitize-html.pipe","ɵba":"./lib/components/reports/reports.component","ɵbb":"./lib/services/xl-file/xl-file.service","ɵbc":"./lib/components/error-banner/error-banner.component","ɵbd":"./lib/services/shared/logger/console-logger.service"},"importAs":"@hmcts/ccpay-web-component"}