digipay-utility-payment 0.0.4 → 0.0.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -676,6 +676,9 @@ class TranslationService {
|
|
|
676
676
|
COMMON_LABEL_PLEASE_ENTER: 'Please enter',
|
|
677
677
|
COMMON_LABEL_AMOUNT_MUST_BE_BETWEEN: 'Amount must be between',
|
|
678
678
|
COMMON_LABEL_AND: 'and',
|
|
679
|
+
STATUS_UPDATED_SUCCESSFULLY: 'Status updated successfully',
|
|
680
|
+
TOP_UP_COMPANY_BILL_PAYMENT_WORKFLOW_SCREEN_MAPPING_DATA_NOT_FOUND: 'Top-up company bill payment workflow screen mapping data not found',
|
|
681
|
+
BILL_NOT_FOUND: 'Bill not found'
|
|
679
682
|
};
|
|
680
683
|
translate(key) {
|
|
681
684
|
return TranslationService.LABELS[key] ?? key;
|
|
@@ -1173,7 +1176,7 @@ class VendorProvidersComponent {
|
|
|
1173
1176
|
this.destroy$.unsubscribe();
|
|
1174
1177
|
}
|
|
1175
1178
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: VendorProvidersComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1176
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.17", type: VendorProvidersComponent, isStandalone: true, selector: "sdk-vendor-providers", ngImport: i0, template: "<div class=\"content vendor-providers-content\">\n <header class=\"page-header vendor-providers-page-header d-flex align-items-center justify-content-start container-fluid\">\n <h1 class=\"page-title m-0\">{{ 'LABEL_UTILITIES' | translate }}</h1>\n </header>\n\n <section class=\"page-content container-fluid\">\n <div class=\"card vendor-providers-card\">\n <div class=\"card-header vendor-providers-card-header\">\n <h4 class=\"card-title vendor-providers-category-title m-0\">{{vendorCategory?.category_name}}</h4>\n </div>\n <div class=\"tab-content\">\n <div class=\"tab-pane fadeIn active show\">\n <form role=\"form\" class=\"form-horizontal\">\n <div class=\"card-body vendor-providers-card-body\">\n <div class=\"row justify-content-center\">\n <div class=\"col-12 col-md-10 col-lg-8 vendor-providers-select-col\">\n @if (loadingState) {\n <div class=\"provider-select-wrapper text-center\">\n <div class=\"shimmer shimmer-effect mx-auto\" style=\"height: 20px; width: 100px; margin-bottom: 0.5rem;\"></div>\n <div class=\"shimmer shimmer-effect provider-shimmer-select\" style=\"margin: 0 auto;\"></div>\n </div>\n } @else {\n <div class=\"provider-select-wrapper d-flex align-items-center justify-content-center flex-wrap gap-2\">\n @if (currentVendorKey == \"airtime_credit\" || currentVendorKey == \"airtime_data\") {\n <label class=\"provider-label mb-0\">{{ 'LABEL_OPERATOR' | translate }}</label>\n <ng-select\n name=\"utilityVendorOperator\"\n [(ngModel)]=\"vendorObject\"\n [placeholder]=\"'LABEL_SELECT_OPERATOR' | translate\"\n bindLabel=\"provider_name\"\n [items]=\"vendorProviders\"\n [compareWith]=\"compareWith\"\n clearable=\"true\"\n class=\"provider-select\"\n (change)=\"changeVendorProvider($event)\">\n </ng-select>\n } @else {\n <label class=\"provider-label mb-0\">{{ 'LABEL_PROVIDER' | translate }}</label>\n <ng-select\n name=\"utilityVendorProvider\"\n [(ngModel)]=\"vendorObject\"\n [placeholder]=\"'LABEL_SELECT_PROVIDER' | translate\"\n bindLabel=\"provider_name\"\n [items]=\"vendorProviders\"\n [compareWith]=\"compareWith\"\n clearable=\"true\"\n class=\"provider-select\"\n (change)=\"changeVendorProvider($event)\">\n </ng-select>\n }\n </div>\n }\n </div>\n\n @if (recentTxnArray.length > 0) {\n <div class=\"col-12 mt-2 vendor-providers-recent-section\">\n <div class=\"border-bottom pb-2 mb-2\">\n <h4 class=\"card-title vendor-providers-recent-title font-weight-600 m-0 text-dark\">\n {{ 'LABEL_RECENT_TRANSACTIONS' | translate }}\n </h4>\n </div>\n <div class=\"row g-2\">\n @for (obj of recentTxnArray; track obj) {\n <a (click)=\"handleRecentTxnClick(obj)\">\n <div class=\"card services-box text-center equal-height\">\n <div class=\"card-body\">\n <div class=\"icon\">\n @if (obj?.payment_request?.vendor_provider_image) {\n <img loading=\"lazy\"\n class=\"vendor-recent-txn-icon\"\n [src]=\"obj?.payment_request?.vendor_provider_image\"\n alt=\"\" />\n } @else {\n <i class=\"align-middle fa fa-bookmark vendor-recent-txn-fallback-icon\"></i>\n }\n </div>\n <h5 class=\"font-weight-600 vendor-recent-txn-name mb-1 mt-2\">{{\n obj?.payment_request?.provider_name || \"-\" }}</h5>\n <h6 class=\"m-0 mb-0 vendor-recent-txn-meta text-muted\">{{\n obj?.payment_request?.account_number }}</h6>\n <h6 class=\"m-0 vendor-recent-txn-meta text-muted\">{{obj?.receiver_amount || 0.00 |\n price: { currency } }}</h6>\n </div>\n </div>\n </a>\n }\n </div>\n </div>\n }\n </div>\n </div>\n <div class=\"card-footer vendor-providers-footer bg-light d-flex justify-content-end gap-2\">\n <button type=\"button\" class=\"btn btn-secondary btn-sm\" (click)=\"back()\">{{'COMMON_LABEL_CANCEL' | translate}}</button>\n <button type=\"button\" (click)=\"navigateToWorkFlow()\" class=\"btn btn-primary btn-sm\">{{'COMMON_LABEL_NEXT' | translate}}</button>\n </div>\n </form>\n </div>\n </div>\n </div>\n </section>\n</div>\n\n<style>\n .vendor-providers-content {\n overflow: visible;\n min-height: auto;\n }\n\n .vendor-providers-page-header {\n margin-bottom: 0.5rem;\n }\n\n .vendor-providers-select-col {\n margin-top: 0;\n }\n\n .vendor-providers-card {\n border: 1px solid #e9ecef;\n border-radius: 8px;\n box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);\n overflow: visible;\n min-height: 0;\n }\n\n .vendor-providers-card-header {\n background: #f8f9fa;\n border-bottom: 1px solid #e9ecef;\n padding: 0.5rem 0.75rem;\n font-weight: 600;\n font-size: 0.9rem;\n color: #212529;\n }\n\n .vendor-providers-category-title {\n font-size: 0.95rem;\n font-weight: 600;\n }\n\n .vendor-providers-card-body {\n padding: 0.65rem 0.75rem;\n overflow: visible;\n min-height: 0;\n }\n\n .page-title {\n font-size: 1rem;\n font-weight: 600;\n color: #1a1a1a;\n }\n\n .provider-select-wrapper {\n padding: 0.15rem 0;\n }\n\n .provider-label {\n font-weight: 500;\n font-size: 0.8rem;\n color: #495057;\n }\n\n .provider-select {\n width: 100%;\n max-width: 190px;\n min-width: 0;\n font-size: 0.75rem;\n }\n\n .provider-select ::ng-deep .ng-select-container {\n align-items: center;\n min-height: 26px;\n height: 26px;\n font-size: 0.75rem;\n border-radius: 4px;\n }\n\n .provider-select ::ng-deep .ng-value-container {\n padding-left: 0.4rem;\n padding-top: 0;\n padding-right: 0;\n }\n\n .provider-select ::ng-deep .ng-value-container .ng-value {\n font-size: 0.75rem;\n line-height: 1.2;\n }\n\n .provider-select ::ng-deep .ng-input {\n top: 0;\n padding-left: 0.4rem;\n }\n\n .provider-select ::ng-deep .ng-input > input {\n font-size: 0.75rem;\n min-height: 24px;\n padding: 0.1rem 0;\n }\n\n .provider-select ::ng-deep .ng-placeholder {\n font-size: 0.75rem;\n line-height: 1.2;\n }\n\n .provider-select ::ng-deep .ng-arrow-wrapper {\n width: 20px;\n padding-right: 0.35rem;\n }\n\n .provider-select ::ng-deep .ng-clear-wrapper {\n width: 18px;\n }\n\n .provider-shimmer-select {\n height: 26px;\n width: 100%;\n max-width: 190px;\n }\n\n .vendor-providers-footer {\n padding: 0.35rem 0.6rem;\n }\n\n .vendor-providers-footer .btn {\n font-size: 0.75rem;\n padding: 0.2rem 0.55rem;\n line-height: 1.2;\n border-radius: 4px;\n }\n\n .vendor-providers-recent-title {\n font-size: 0.9rem;\n }\n\n .vendor-providers-recent-section .card-body {\n padding: 0.65rem 0.5rem;\n }\n\n .vendor-recent-txn-icon {\n width: 36px;\n height: 36px;\n border-radius: 50%;\n object-fit: cover;\n }\n\n .vendor-recent-txn-fallback-icon {\n font-size: 1.1rem;\n color: #6c757d;\n }\n\n .vendor-recent-txn-name {\n font-size: 0.8rem;\n line-height: 1.25;\n }\n\n .vendor-recent-txn-meta {\n font-size: 0.72rem;\n line-height: 1.2;\n }\n\n .shimmer-effect {\n border-radius: 10px;\n background-color: #F6F7F8;\n background-image: linear-gradient(to right, #F6F7F8 0, #EDEEF1 20%, #F6F7F8 40%, #F6F7F8 100%);\n background-position: 0 0;\n background-repeat: no-repeat;\n background-size: 1000px 1000px;\n animation: shimmerEffect 1s linear infinite forwards;\n }\n\n .shimmer {\n display: inline-block;\n width: 100%;\n height: 12px;\n }\n\n @keyframes shimmerEffect {\n 0% {\n background-position: -1000px 0;\n }\n 100% {\n background-position: 1000px 0;\n }\n }\n</style>\n", styles: [".vendor-providers-content{overflow:visible;min-height:auto}.vendor-providers-page-header{margin-bottom:.5rem}.vendor-providers-select-col{margin-top:0}.vendor-providers-card{border:1px solid #e9ecef;border-radius:8px;box-shadow:0 1px 4px #0000000d;overflow:visible;min-height:0}.vendor-providers-card-header{background:#f8f9fa;border-bottom:1px solid #e9ecef;padding:.5rem .75rem;font-weight:600;font-size:.9rem;color:#212529}.vendor-providers-category-title{font-size:.95rem;font-weight:600}.vendor-providers-card-body{padding:.65rem .75rem;overflow:visible;min-height:0}.page-title{font-size:1rem;font-weight:600;color:#1a1a1a}.provider-select-wrapper{padding:.15rem 0}.provider-label{font-weight:500;font-size:.8rem;color:#495057}.provider-select{width:100%;max-width:190px;min-width:0;font-size:.75rem}.provider-select ::ng-deep .ng-select-container{align-items:center;min-height:26px;height:26px;font-size:.75rem;border-radius:4px}.provider-select ::ng-deep .ng-value-container{padding-left:.4rem;padding-top:0;padding-right:0}.provider-select ::ng-deep .ng-value-container .ng-value{font-size:.75rem;line-height:1.2}.provider-select ::ng-deep .ng-input{top:0;padding-left:.4rem}.provider-select ::ng-deep .ng-input>input{font-size:.75rem;min-height:24px;padding:.1rem 0}.provider-select ::ng-deep .ng-placeholder{font-size:.75rem;line-height:1.2}.provider-select ::ng-deep .ng-arrow-wrapper{width:20px;padding-right:.35rem}.provider-select ::ng-deep .ng-clear-wrapper{width:18px}.provider-shimmer-select{height:26px;width:100%;max-width:190px}.vendor-providers-footer{padding:.35rem .6rem}.vendor-providers-footer .btn{font-size:.75rem;padding:.2rem .55rem;line-height:1.2;border-radius:4px}.vendor-providers-recent-title{font-size:.9rem}.vendor-providers-recent-section .card-body{padding:.65rem .5rem}.vendor-recent-txn-icon{width:36px;height:36px;border-radius:50%;object-fit:cover}.vendor-recent-txn-fallback-icon{font-size:1.1rem;color:#6c757d}.vendor-recent-txn-name{font-size:.8rem;line-height:1.25}.vendor-recent-txn-meta{font-size:.72rem;line-height:1.2}.shimmer-effect{border-radius:10px;background-color:#f6f7f8;background-image:linear-gradient(to right,#f6f7f8 0,#edeef1 20%,#f6f7f8 40% 100%);background-position:0 0;background-repeat:no-repeat;background-size:1000px 1000px;animation:shimmerEffect 1s linear infinite forwards}.shimmer{display:inline-block;width:100%;height:12px}@keyframes shimmerEffect{0%{background-position:-1000px 0}to{background-position:1000px 0}}\n"], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "ngmodule", type: NgSelectModule }, { kind: "component", type: i1$1.NgSelectComponent, selector: "ng-select", inputs: ["ariaLabelDropdown", "bindLabel", "bindValue", "ariaLabel", "markFirst", "placeholder", "fixedPlaceholder", "notFoundText", "typeToSearchText", "preventToggleOnRightClick", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "tabFocusOnClearButton", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "ngClass", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick", "keyDownFn"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: FormlyBootstrapModule }, { kind: "ngmodule", type: FormlyModule }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: PricePipe, name: "price" }] });
|
|
1179
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.17", type: VendorProvidersComponent, isStandalone: true, selector: "sdk-vendor-providers", ngImport: i0, template: "<div class=\"content\">\n <header class=\"page-header\">\n <div class=\"d-flex align-items-center flex-wrap\">\n <div class=\"mr-auto\">\n <h1>Utilities</h1>\n </div>\n </div>\n </header>\n\n <section class=\"page-content container-fluid\">\n\n <div class=\"card m-0 border-0\">\n <div class=\"card-header p-t-25 p-b-20\">\n <h4 class=\"card-title font-weight-600 font-size-18 m-0 text-dark\">{{vendorCategory?.category_name}}</h4>\n </div>\n <div class=\"tab-content\">\n <div class=\"tab-pane fadeIn active show\">\n <form role=\"form\" class=\"form-horizontal\">\n <div class=\"card-body\">\n <div class=\"mt-3\">\n <div class=\"row\">\n <div class=\"col-xl-10 offset-xl-1\">\n @if (loadingState) {\n <div class=\"form-group form-row\">\n <div class=\"control-label text-md-right col-md-4 col-lg-3\">\n <div class=\"shimmer shimmer-effect\" style=\"height: 20px; width: 80px; margin-top: 8px;\"></div>\n </div>\n <div class=\"col-md-5\">\n <div class=\"shimmer shimmer-effect\" style=\"height: 38px; width: 100%;\"></div>\n </div>\n </div>\n } @else {\n @if (currentVendorKey == \"airtime_credit\" || currentVendorKey == \"airtime_data\" ) {\n <div class=\"form-group form-row\">\n <label\n class=\"control-label text-md-right col-md-4 col-lg-3\">\n {{'LABEL_OPERATOR' | translate}}\n </label>\n <div class=\"col-md-5\">\n <ng-select \n [placeholder]=\"'LABEL_SELECT_OPERATOR' | translate\" \n bindLabel=\"provider_name\"\n bindValue=\"id\" \n [items]=\"vendorProviders\"\n (change)=\"changeVendorProvider($event)\">\n </ng-select>\n </div>\n </div>\n } @else {\n <div class=\"form-group form-row\">\n <label\n class=\"control-label text-md-right col-md-4 col-lg-3\">\n {{'LABEL_PROVIDER' | translate}}\n </label>\n <div class=\"col-md-5\">\n <ng-select \n [placeholder]=\"'LABEL_SELECT_PROVIDER' | translate\" \n bindLabel=\"provider_name\"\n bindValue=\"id\" \n [items]=\"vendorProviders\"\n (change)=\"changeVendorProvider($event)\">\n </ng-select>\n </div>\n </div>\n }\n }\n </div>\n\n @if (recentTxnArray.length > 0) {\n <div class=\"col-xl-12\">\n <div class=\"border-bottom p-t-25 p-b-20\">\n <h4 class=\"card-title font-weight-600 font-size-18 m-0 text-dark\">\n {{'LABEL_RECENT_TRANSACTIONS' | translate}}</h4>\n </div>\n </div>\n <div class=\"row\">\n @for (obj of recentTxnArray; track obj) {\n <a (click)=\"handleRecentTxnClick(obj)\">\n <div class=\"card services-box text-center equal-height\">\n <div class=\"card-body\">\n <div class=\"icon\">\n @if (obj?.payment_request?.vendor_provider_image) {\n <img loading=\"lazy\"\n style=\"width: 50px; height: 50px; border-radius: 50%;\"\n [src]=\"obj?.payment_request?.vendor_provider_image\"\n alt=\"\" />\n } @else {\n <i class=\"align-middle fa fa-2x fa-bookmark\"></i>\n }\n </div>\n <h5 class=\"font-weight-600 mb-2 mt-3\">{{\n obj?.payment_request?.provider_name || \"-\" }}</h5>\n <h6 class=\"m-0 mb-1 text-muted\">{{\n obj?.payment_request?.account_number }}</h6>\n <h6 class=\"m-0 text-muted\">{{obj?.receiver_amount || 0.00 |\n price: { currency } }}</h6>\n </div>\n </div>\n </a>\n }\n </div>\n }\n </div>\n </div>\n </div>\n <div class=\"card-footer bg-light text-right\">\n <button type=\"button\" class=\"btn btn-secondary\" (click)=\"back()\">{{'COMMON_LABEL_CANCEL' | translate}}</button>\n <button type=\"button\" (click)=\"navigateToWorkFlow()\"\n class=\"btn btn-primary\">{{'COMMON_LABEL_NEXT' |translate}}</button>\n </div>\n </form>\n </div>\n </div>\n </div>\n </section>\n</div>\n\n<style>\n .shimmer-effect {\n border-radius: 10px;\n background-color: #F6F7F8;\n background-image: linear-gradient(to right, #F6F7F8 0, #EDEEF1 20%, #F6F7F8 40%, #F6F7F8 100%);\n background-position: 0 0;\n background-repeat: no-repeat;\n background-size: 1000px 1000px;\n animation: shimmerEffect 1s linear infinite forwards;\n }\n\n .shimmer {\n display: inline-block;\n width: 100%;\n height: 12px;\n }\n\n @keyframes shimmerEffect {\n 0% {\n background-position: -1000px 0;\n }\n 100% {\n background-position: 1000px 0;\n }\n }\n</style>", styles: [".shimmer-effect{border-radius:10px;background-color:#f6f7f8;background-image:linear-gradient(to right,#f6f7f8 0,#edeef1 20%,#f6f7f8 40% 100%);background-position:0 0;background-repeat:no-repeat;background-size:1000px 1000px;animation:shimmerEffect 1s linear infinite forwards}.shimmer{display:inline-block;width:100%;height:12px}@keyframes shimmerEffect{0%{background-position:-1000px 0}to{background-position:1000px 0}}\n"], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "ngmodule", type: NgSelectModule }, { kind: "component", type: i1$1.NgSelectComponent, selector: "ng-select", inputs: ["ariaLabelDropdown", "bindLabel", "bindValue", "ariaLabel", "markFirst", "placeholder", "fixedPlaceholder", "notFoundText", "typeToSearchText", "preventToggleOnRightClick", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "tabFocusOnClearButton", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "ngClass", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick", "keyDownFn"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: FormlyBootstrapModule }, { kind: "ngmodule", type: FormlyModule }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: PricePipe, name: "price" }] });
|
|
1177
1180
|
}
|
|
1178
1181
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: VendorProvidersComponent, decorators: [{
|
|
1179
1182
|
type: Component,
|
|
@@ -1184,7 +1187,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
|
|
|
1184
1187
|
ReactiveFormsModule,
|
|
1185
1188
|
FormlyBootstrapModule,
|
|
1186
1189
|
FormlyModule
|
|
1187
|
-
], template: "<div class=\"content
|
|
1190
|
+
], template: "<div class=\"content\">\n <header class=\"page-header\">\n <div class=\"d-flex align-items-center flex-wrap\">\n <div class=\"mr-auto\">\n <h1>Utilities</h1>\n </div>\n </div>\n </header>\n\n <section class=\"page-content container-fluid\">\n\n <div class=\"card m-0 border-0\">\n <div class=\"card-header p-t-25 p-b-20\">\n <h4 class=\"card-title font-weight-600 font-size-18 m-0 text-dark\">{{vendorCategory?.category_name}}</h4>\n </div>\n <div class=\"tab-content\">\n <div class=\"tab-pane fadeIn active show\">\n <form role=\"form\" class=\"form-horizontal\">\n <div class=\"card-body\">\n <div class=\"mt-3\">\n <div class=\"row\">\n <div class=\"col-xl-10 offset-xl-1\">\n @if (loadingState) {\n <div class=\"form-group form-row\">\n <div class=\"control-label text-md-right col-md-4 col-lg-3\">\n <div class=\"shimmer shimmer-effect\" style=\"height: 20px; width: 80px; margin-top: 8px;\"></div>\n </div>\n <div class=\"col-md-5\">\n <div class=\"shimmer shimmer-effect\" style=\"height: 38px; width: 100%;\"></div>\n </div>\n </div>\n } @else {\n @if (currentVendorKey == \"airtime_credit\" || currentVendorKey == \"airtime_data\" ) {\n <div class=\"form-group form-row\">\n <label\n class=\"control-label text-md-right col-md-4 col-lg-3\">\n {{'LABEL_OPERATOR' | translate}}\n </label>\n <div class=\"col-md-5\">\n <ng-select \n [placeholder]=\"'LABEL_SELECT_OPERATOR' | translate\" \n bindLabel=\"provider_name\"\n bindValue=\"id\" \n [items]=\"vendorProviders\"\n (change)=\"changeVendorProvider($event)\">\n </ng-select>\n </div>\n </div>\n } @else {\n <div class=\"form-group form-row\">\n <label\n class=\"control-label text-md-right col-md-4 col-lg-3\">\n {{'LABEL_PROVIDER' | translate}}\n </label>\n <div class=\"col-md-5\">\n <ng-select \n [placeholder]=\"'LABEL_SELECT_PROVIDER' | translate\" \n bindLabel=\"provider_name\"\n bindValue=\"id\" \n [items]=\"vendorProviders\"\n (change)=\"changeVendorProvider($event)\">\n </ng-select>\n </div>\n </div>\n }\n }\n </div>\n\n @if (recentTxnArray.length > 0) {\n <div class=\"col-xl-12\">\n <div class=\"border-bottom p-t-25 p-b-20\">\n <h4 class=\"card-title font-weight-600 font-size-18 m-0 text-dark\">\n {{'LABEL_RECENT_TRANSACTIONS' | translate}}</h4>\n </div>\n </div>\n <div class=\"row\">\n @for (obj of recentTxnArray; track obj) {\n <a (click)=\"handleRecentTxnClick(obj)\">\n <div class=\"card services-box text-center equal-height\">\n <div class=\"card-body\">\n <div class=\"icon\">\n @if (obj?.payment_request?.vendor_provider_image) {\n <img loading=\"lazy\"\n style=\"width: 50px; height: 50px; border-radius: 50%;\"\n [src]=\"obj?.payment_request?.vendor_provider_image\"\n alt=\"\" />\n } @else {\n <i class=\"align-middle fa fa-2x fa-bookmark\"></i>\n }\n </div>\n <h5 class=\"font-weight-600 mb-2 mt-3\">{{\n obj?.payment_request?.provider_name || \"-\" }}</h5>\n <h6 class=\"m-0 mb-1 text-muted\">{{\n obj?.payment_request?.account_number }}</h6>\n <h6 class=\"m-0 text-muted\">{{obj?.receiver_amount || 0.00 |\n price: { currency } }}</h6>\n </div>\n </div>\n </a>\n }\n </div>\n }\n </div>\n </div>\n </div>\n <div class=\"card-footer bg-light text-right\">\n <button type=\"button\" class=\"btn btn-secondary\" (click)=\"back()\">{{'COMMON_LABEL_CANCEL' | translate}}</button>\n <button type=\"button\" (click)=\"navigateToWorkFlow()\"\n class=\"btn btn-primary\">{{'COMMON_LABEL_NEXT' |translate}}</button>\n </div>\n </form>\n </div>\n </div>\n </div>\n </section>\n</div>\n\n<style>\n .shimmer-effect {\n border-radius: 10px;\n background-color: #F6F7F8;\n background-image: linear-gradient(to right, #F6F7F8 0, #EDEEF1 20%, #F6F7F8 40%, #F6F7F8 100%);\n background-position: 0 0;\n background-repeat: no-repeat;\n background-size: 1000px 1000px;\n animation: shimmerEffect 1s linear infinite forwards;\n }\n\n .shimmer {\n display: inline-block;\n width: 100%;\n height: 12px;\n }\n\n @keyframes shimmerEffect {\n 0% {\n background-position: -1000px 0;\n }\n 100% {\n background-position: 1000px 0;\n }\n }\n</style>" }]
|
|
1188
1191
|
}], ctorParameters: () => [] });
|
|
1189
1192
|
|
|
1190
1193
|
class NoDataComponent {
|
|
@@ -1198,9 +1201,9 @@ class NoDataComponent {
|
|
|
1198
1201
|
<i class="la" [class.icon]="icon"></i>
|
|
1199
1202
|
</div>
|
|
1200
1203
|
}
|
|
1201
|
-
<p class="text-muted">{{ title }}</p>
|
|
1204
|
+
<p class="text-muted">{{ title | translate }}</p>
|
|
1202
1205
|
</div>
|
|
1203
|
-
`, isInline: true });
|
|
1206
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
|
|
1204
1207
|
}
|
|
1205
1208
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: NoDataComponent, decorators: [{
|
|
1206
1209
|
type: Component,
|
|
@@ -1213,10 +1216,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
|
|
|
1213
1216
|
<i class="la" [class.icon]="icon"></i>
|
|
1214
1217
|
</div>
|
|
1215
1218
|
}
|
|
1216
|
-
<p class="text-muted">{{ title }}</p>
|
|
1219
|
+
<p class="text-muted">{{ title | translate }}</p>
|
|
1217
1220
|
</div>
|
|
1218
1221
|
`,
|
|
1219
1222
|
standalone: true,
|
|
1223
|
+
imports: [SharedModule],
|
|
1220
1224
|
}]
|
|
1221
1225
|
}], propDecorators: { title: [{
|
|
1222
1226
|
type: Input
|
|
@@ -1234,7 +1238,7 @@ class FormlyHorizontalWrapperComponent extends FieldWrapper {
|
|
|
1234
1238
|
<em class="text-danger">*</em>
|
|
1235
1239
|
}
|
|
1236
1240
|
</label>
|
|
1237
|
-
<div class="col-md-
|
|
1241
|
+
<div class="col-md-5">
|
|
1238
1242
|
<ng-template #fieldComponent></ng-template>
|
|
1239
1243
|
@if (showError) {
|
|
1240
1244
|
<div class="invalid-feedback d-block">
|
|
@@ -1259,7 +1263,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
|
|
|
1259
1263
|
<em class="text-danger">*</em>
|
|
1260
1264
|
}
|
|
1261
1265
|
</label>
|
|
1262
|
-
<div class="col-md-
|
|
1266
|
+
<div class="col-md-5">
|
|
1263
1267
|
<ng-template #fieldComponent></ng-template>
|
|
1264
1268
|
@if (showError) {
|
|
1265
1269
|
<div class="invalid-feedback d-block">
|
|
@@ -1382,25 +1386,435 @@ class CommonLoaderComponent {
|
|
|
1382
1386
|
message = 'Please wait...';
|
|
1383
1387
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: CommonLoaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1384
1388
|
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.17", type: CommonLoaderComponent, isStandalone: true, selector: "sdk-common-loader", inputs: { message: "message" }, ngImport: i0, template: `
|
|
1385
|
-
<div class="
|
|
1386
|
-
|
|
1387
|
-
<
|
|
1388
|
-
|
|
1389
|
-
|
|
1389
|
+
<div class="loader-container">
|
|
1390
|
+
<div class="loader-logo">
|
|
1391
|
+
<div class="sk-chase">
|
|
1392
|
+
<div class="sk-chase-dot"></div>
|
|
1393
|
+
<div class="sk-chase-dot"></div>
|
|
1394
|
+
<div class="sk-chase-dot"></div>
|
|
1395
|
+
<div class="sk-chase-dot"></div>
|
|
1396
|
+
<div class="sk-chase-dot"></div>
|
|
1397
|
+
<div class="sk-chase-dot"></div>
|
|
1398
|
+
</div>
|
|
1399
|
+
{{message}}
|
|
1390
1400
|
</div>
|
|
1391
|
-
|
|
1401
|
+
</div>
|
|
1402
|
+
|
|
1403
|
+
|
|
1404
|
+
<style>
|
|
1405
|
+
/*Loader*/
|
|
1406
|
+
.loader-container {
|
|
1407
|
+
position: fixed;
|
|
1408
|
+
z-index: 2000;
|
|
1409
|
+
top: 0;
|
|
1410
|
+
left: 0;
|
|
1411
|
+
bottom: 0;
|
|
1412
|
+
right: 0;
|
|
1413
|
+
background-color: rgba(255, 255, 255, 0.6);
|
|
1414
|
+
}
|
|
1415
|
+
|
|
1416
|
+
.loader-logo {
|
|
1417
|
+
position: absolute;
|
|
1418
|
+
top: 50%;
|
|
1419
|
+
left: 0;
|
|
1420
|
+
right: 0;
|
|
1421
|
+
margin: 0 auto;
|
|
1422
|
+
z-index: 5;
|
|
1423
|
+
-webkit-transform: translateY(-50%);
|
|
1424
|
+
-moz-transform: translateY(-50%);
|
|
1425
|
+
-ms-transform: translateY(-50%);
|
|
1426
|
+
-o-transform: translateY(-50%);
|
|
1427
|
+
transform: translateY(-50%);
|
|
1428
|
+
text-align: center;
|
|
1429
|
+
font-size: 17px;
|
|
1430
|
+
font-weight: 500;
|
|
1431
|
+
}
|
|
1432
|
+
|
|
1433
|
+
/*Loader Spinner*/
|
|
1434
|
+
.loader-container .spinner {
|
|
1435
|
+
margin: 0 auto;
|
|
1436
|
+
width: 70px;
|
|
1437
|
+
height: 55px;
|
|
1438
|
+
text-align: center;
|
|
1439
|
+
font-size: 20px;
|
|
1440
|
+
}
|
|
1441
|
+
|
|
1442
|
+
.loader-container .spinner>div {
|
|
1443
|
+
background-color: #333;
|
|
1444
|
+
height: 100%;
|
|
1445
|
+
width: 6px;
|
|
1446
|
+
display: inline-block;
|
|
1447
|
+
-webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out;
|
|
1448
|
+
animation: sk-stretchdelay 1.2s infinite ease-in-out;
|
|
1449
|
+
}
|
|
1450
|
+
|
|
1451
|
+
.loader-container .spinner .rect2 {
|
|
1452
|
+
-webkit-animation-delay: -1.1s;
|
|
1453
|
+
animation-delay: -1.1s;
|
|
1454
|
+
}
|
|
1455
|
+
|
|
1456
|
+
.loader-container .spinner .rect3 {
|
|
1457
|
+
-webkit-animation-delay: -1.0s;
|
|
1458
|
+
animation-delay: -1.0s;
|
|
1459
|
+
}
|
|
1460
|
+
|
|
1461
|
+
.loader-container .spinner .rect4 {
|
|
1462
|
+
-webkit-animation-delay: -0.9s;
|
|
1463
|
+
animation-delay: -0.9s;
|
|
1464
|
+
}
|
|
1465
|
+
|
|
1466
|
+
.loader-container .spinner .rect5 {
|
|
1467
|
+
-webkit-animation-delay: -0.8s;
|
|
1468
|
+
animation-delay: -0.8s;
|
|
1469
|
+
}
|
|
1470
|
+
|
|
1471
|
+
@-webkit-keyframes sk-stretchdelay {
|
|
1472
|
+
|
|
1473
|
+
0%,
|
|
1474
|
+
40%,
|
|
1475
|
+
100% {
|
|
1476
|
+
-webkit-transform: scaleY(0.4)
|
|
1477
|
+
}
|
|
1478
|
+
|
|
1479
|
+
20% {
|
|
1480
|
+
-webkit-transform: scaleY(1.0)
|
|
1481
|
+
}
|
|
1482
|
+
}
|
|
1483
|
+
|
|
1484
|
+
@keyframes sk-stretchdelay {
|
|
1485
|
+
|
|
1486
|
+
0%,
|
|
1487
|
+
40%,
|
|
1488
|
+
100% {
|
|
1489
|
+
transform: scaleY(0.4);
|
|
1490
|
+
-webkit-transform: scaleY(0.4);
|
|
1491
|
+
}
|
|
1492
|
+
|
|
1493
|
+
20% {
|
|
1494
|
+
transform: scaleY(1.0);
|
|
1495
|
+
-webkit-transform: scaleY(1.0);
|
|
1496
|
+
}
|
|
1497
|
+
}
|
|
1498
|
+
|
|
1499
|
+
/*Loader sk-chase*/
|
|
1500
|
+
.sk-chase {
|
|
1501
|
+
width: 55px;
|
|
1502
|
+
height: 55px;
|
|
1503
|
+
position: relative;
|
|
1504
|
+
margin: 0 auto 20px;
|
|
1505
|
+
animation: sk-chase 2.5s infinite linear both;
|
|
1506
|
+
}
|
|
1507
|
+
|
|
1508
|
+
.sk-chase-dot {
|
|
1509
|
+
width: 100%;
|
|
1510
|
+
height: 100%;
|
|
1511
|
+
position: absolute;
|
|
1512
|
+
left: 0;
|
|
1513
|
+
top: 0;
|
|
1514
|
+
animation: sk-chase-dot 2.0s infinite ease-in-out both;
|
|
1515
|
+
}
|
|
1516
|
+
|
|
1517
|
+
.sk-chase-dot:before {
|
|
1518
|
+
content: '';
|
|
1519
|
+
display: block;
|
|
1520
|
+
width: 25%;
|
|
1521
|
+
height: 25%;
|
|
1522
|
+
background-color: #212121;
|
|
1523
|
+
border-radius: 100%;
|
|
1524
|
+
animation: sk-chase-dot-before 2.0s infinite ease-in-out both;
|
|
1525
|
+
}
|
|
1526
|
+
|
|
1527
|
+
.sk-chase-dot:nth-child(1) {
|
|
1528
|
+
animation-delay: -1.1s;
|
|
1529
|
+
}
|
|
1530
|
+
|
|
1531
|
+
.sk-chase-dot:nth-child(2) {
|
|
1532
|
+
animation-delay: -1.0s;
|
|
1533
|
+
}
|
|
1534
|
+
|
|
1535
|
+
.sk-chase-dot:nth-child(3) {
|
|
1536
|
+
animation-delay: -0.9s;
|
|
1537
|
+
}
|
|
1538
|
+
|
|
1539
|
+
.sk-chase-dot:nth-child(4) {
|
|
1540
|
+
animation-delay: -0.8s;
|
|
1541
|
+
}
|
|
1542
|
+
|
|
1543
|
+
.sk-chase-dot:nth-child(5) {
|
|
1544
|
+
animation-delay: -0.7s;
|
|
1545
|
+
}
|
|
1546
|
+
|
|
1547
|
+
.sk-chase-dot:nth-child(6) {
|
|
1548
|
+
animation-delay: -0.6s;
|
|
1549
|
+
}
|
|
1550
|
+
|
|
1551
|
+
.sk-chase-dot:nth-child(1):before {
|
|
1552
|
+
animation-delay: -1.1s;
|
|
1553
|
+
}
|
|
1554
|
+
|
|
1555
|
+
.sk-chase-dot:nth-child(2):before {
|
|
1556
|
+
animation-delay: -1.0s;
|
|
1557
|
+
}
|
|
1558
|
+
|
|
1559
|
+
.sk-chase-dot:nth-child(3):before {
|
|
1560
|
+
animation-delay: -0.9s;
|
|
1561
|
+
}
|
|
1562
|
+
|
|
1563
|
+
.sk-chase-dot:nth-child(4):before {
|
|
1564
|
+
animation-delay: -0.8s;
|
|
1565
|
+
}
|
|
1566
|
+
|
|
1567
|
+
.sk-chase-dot:nth-child(5):before {
|
|
1568
|
+
animation-delay: -0.7s;
|
|
1569
|
+
}
|
|
1570
|
+
|
|
1571
|
+
.sk-chase-dot:nth-child(6):before {
|
|
1572
|
+
animation-delay: -0.6s;
|
|
1573
|
+
}
|
|
1574
|
+
|
|
1575
|
+
@keyframes sk-chase {
|
|
1576
|
+
100% {
|
|
1577
|
+
transform: rotate(360deg);
|
|
1578
|
+
}
|
|
1579
|
+
}
|
|
1580
|
+
|
|
1581
|
+
@keyframes sk-chase-dot {
|
|
1582
|
+
|
|
1583
|
+
80%,
|
|
1584
|
+
100% {
|
|
1585
|
+
transform: rotate(360deg);
|
|
1586
|
+
}
|
|
1587
|
+
}
|
|
1588
|
+
|
|
1589
|
+
@keyframes sk-chase-dot-before {
|
|
1590
|
+
50% {
|
|
1591
|
+
transform: scale(0.4);
|
|
1592
|
+
}
|
|
1593
|
+
|
|
1594
|
+
100%,
|
|
1595
|
+
0% {
|
|
1596
|
+
transform: scale(1.0);
|
|
1597
|
+
}
|
|
1598
|
+
}
|
|
1599
|
+
</style>
|
|
1600
|
+
`, isInline: true, styles: [".loader-container{position:fixed;z-index:2000;inset:0;background-color:#fff9}.loader-logo{position:absolute;top:50%;left:0;right:0;margin:0 auto;z-index:5;-webkit-transform:translateY(-50%);-moz-transform:translateY(-50%);-ms-transform:translateY(-50%);-o-transform:translateY(-50%);transform:translateY(-50%);text-align:center;font-size:17px;font-weight:500}.loader-container .spinner{margin:0 auto;width:70px;height:55px;text-align:center;font-size:20px}.loader-container .spinner>div{background-color:#333;height:100%;width:6px;display:inline-block;-webkit-animation:sk-stretchdelay 1.2s infinite ease-in-out;animation:sk-stretchdelay 1.2s infinite ease-in-out}.loader-container .spinner .rect2{-webkit-animation-delay:-1.1s;animation-delay:-1.1s}.loader-container .spinner .rect3{-webkit-animation-delay:-1s;animation-delay:-1s}.loader-container .spinner .rect4{-webkit-animation-delay:-.9s;animation-delay:-.9s}.loader-container .spinner .rect5{-webkit-animation-delay:-.8s;animation-delay:-.8s}@-webkit-keyframes sk-stretchdelay{0%,40%,to{-webkit-transform:scaleY(.4)}20%{-webkit-transform:scaleY(1)}}@keyframes sk-stretchdelay{0%,40%,to{transform:scaleY(.4);-webkit-transform:scaleY(.4)}20%{transform:scaleY(1);-webkit-transform:scaleY(1)}}.sk-chase{width:55px;height:55px;position:relative;margin:0 auto 20px;animation:sk-chase 2.5s infinite linear both}.sk-chase-dot{width:100%;height:100%;position:absolute;left:0;top:0;animation:sk-chase-dot 2s infinite ease-in-out both}.sk-chase-dot:before{content:\"\";display:block;width:25%;height:25%;background-color:#212121;border-radius:100%;animation:sk-chase-dot-before 2s infinite ease-in-out both}.sk-chase-dot:nth-child(1){animation-delay:-1.1s}.sk-chase-dot:nth-child(2){animation-delay:-1s}.sk-chase-dot:nth-child(3){animation-delay:-.9s}.sk-chase-dot:nth-child(4){animation-delay:-.8s}.sk-chase-dot:nth-child(5){animation-delay:-.7s}.sk-chase-dot:nth-child(6){animation-delay:-.6s}.sk-chase-dot:nth-child(1):before{animation-delay:-1.1s}.sk-chase-dot:nth-child(2):before{animation-delay:-1s}.sk-chase-dot:nth-child(3):before{animation-delay:-.9s}.sk-chase-dot:nth-child(4):before{animation-delay:-.8s}.sk-chase-dot:nth-child(5):before{animation-delay:-.7s}.sk-chase-dot:nth-child(6):before{animation-delay:-.6s}@keyframes sk-chase{to{transform:rotate(360deg)}}@keyframes sk-chase-dot{80%,to{transform:rotate(360deg)}}@keyframes sk-chase-dot-before{50%{transform:scale(.4)}to,0%{transform:scale(1)}}\n"] });
|
|
1392
1601
|
}
|
|
1393
1602
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: CommonLoaderComponent, decorators: [{
|
|
1394
1603
|
type: Component,
|
|
1395
1604
|
args: [{
|
|
1396
1605
|
selector: 'sdk-common-loader',
|
|
1397
1606
|
template: `
|
|
1398
|
-
<div class="
|
|
1399
|
-
|
|
1400
|
-
<
|
|
1401
|
-
|
|
1402
|
-
|
|
1607
|
+
<div class="loader-container">
|
|
1608
|
+
<div class="loader-logo">
|
|
1609
|
+
<div class="sk-chase">
|
|
1610
|
+
<div class="sk-chase-dot"></div>
|
|
1611
|
+
<div class="sk-chase-dot"></div>
|
|
1612
|
+
<div class="sk-chase-dot"></div>
|
|
1613
|
+
<div class="sk-chase-dot"></div>
|
|
1614
|
+
<div class="sk-chase-dot"></div>
|
|
1615
|
+
<div class="sk-chase-dot"></div>
|
|
1616
|
+
</div>
|
|
1617
|
+
{{message}}
|
|
1403
1618
|
</div>
|
|
1619
|
+
</div>
|
|
1620
|
+
|
|
1621
|
+
|
|
1622
|
+
<style>
|
|
1623
|
+
/*Loader*/
|
|
1624
|
+
.loader-container {
|
|
1625
|
+
position: fixed;
|
|
1626
|
+
z-index: 2000;
|
|
1627
|
+
top: 0;
|
|
1628
|
+
left: 0;
|
|
1629
|
+
bottom: 0;
|
|
1630
|
+
right: 0;
|
|
1631
|
+
background-color: rgba(255, 255, 255, 0.6);
|
|
1632
|
+
}
|
|
1633
|
+
|
|
1634
|
+
.loader-logo {
|
|
1635
|
+
position: absolute;
|
|
1636
|
+
top: 50%;
|
|
1637
|
+
left: 0;
|
|
1638
|
+
right: 0;
|
|
1639
|
+
margin: 0 auto;
|
|
1640
|
+
z-index: 5;
|
|
1641
|
+
-webkit-transform: translateY(-50%);
|
|
1642
|
+
-moz-transform: translateY(-50%);
|
|
1643
|
+
-ms-transform: translateY(-50%);
|
|
1644
|
+
-o-transform: translateY(-50%);
|
|
1645
|
+
transform: translateY(-50%);
|
|
1646
|
+
text-align: center;
|
|
1647
|
+
font-size: 17px;
|
|
1648
|
+
font-weight: 500;
|
|
1649
|
+
}
|
|
1650
|
+
|
|
1651
|
+
/*Loader Spinner*/
|
|
1652
|
+
.loader-container .spinner {
|
|
1653
|
+
margin: 0 auto;
|
|
1654
|
+
width: 70px;
|
|
1655
|
+
height: 55px;
|
|
1656
|
+
text-align: center;
|
|
1657
|
+
font-size: 20px;
|
|
1658
|
+
}
|
|
1659
|
+
|
|
1660
|
+
.loader-container .spinner>div {
|
|
1661
|
+
background-color: #333;
|
|
1662
|
+
height: 100%;
|
|
1663
|
+
width: 6px;
|
|
1664
|
+
display: inline-block;
|
|
1665
|
+
-webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out;
|
|
1666
|
+
animation: sk-stretchdelay 1.2s infinite ease-in-out;
|
|
1667
|
+
}
|
|
1668
|
+
|
|
1669
|
+
.loader-container .spinner .rect2 {
|
|
1670
|
+
-webkit-animation-delay: -1.1s;
|
|
1671
|
+
animation-delay: -1.1s;
|
|
1672
|
+
}
|
|
1673
|
+
|
|
1674
|
+
.loader-container .spinner .rect3 {
|
|
1675
|
+
-webkit-animation-delay: -1.0s;
|
|
1676
|
+
animation-delay: -1.0s;
|
|
1677
|
+
}
|
|
1678
|
+
|
|
1679
|
+
.loader-container .spinner .rect4 {
|
|
1680
|
+
-webkit-animation-delay: -0.9s;
|
|
1681
|
+
animation-delay: -0.9s;
|
|
1682
|
+
}
|
|
1683
|
+
|
|
1684
|
+
.loader-container .spinner .rect5 {
|
|
1685
|
+
-webkit-animation-delay: -0.8s;
|
|
1686
|
+
animation-delay: -0.8s;
|
|
1687
|
+
}
|
|
1688
|
+
|
|
1689
|
+
@-webkit-keyframes sk-stretchdelay {
|
|
1690
|
+
|
|
1691
|
+
0%,
|
|
1692
|
+
40%,
|
|
1693
|
+
100% {
|
|
1694
|
+
-webkit-transform: scaleY(0.4)
|
|
1695
|
+
}
|
|
1696
|
+
|
|
1697
|
+
20% {
|
|
1698
|
+
-webkit-transform: scaleY(1.0)
|
|
1699
|
+
}
|
|
1700
|
+
}
|
|
1701
|
+
|
|
1702
|
+
@keyframes sk-stretchdelay {
|
|
1703
|
+
|
|
1704
|
+
0%,
|
|
1705
|
+
40%,
|
|
1706
|
+
100% {
|
|
1707
|
+
transform: scaleY(0.4);
|
|
1708
|
+
-webkit-transform: scaleY(0.4);
|
|
1709
|
+
}
|
|
1710
|
+
|
|
1711
|
+
20% {
|
|
1712
|
+
transform: scaleY(1.0);
|
|
1713
|
+
-webkit-transform: scaleY(1.0);
|
|
1714
|
+
}
|
|
1715
|
+
}
|
|
1716
|
+
|
|
1717
|
+
/*Loader sk-chase*/
|
|
1718
|
+
.sk-chase {
|
|
1719
|
+
width: 55px;
|
|
1720
|
+
height: 55px;
|
|
1721
|
+
position: relative;
|
|
1722
|
+
margin: 0 auto 20px;
|
|
1723
|
+
animation: sk-chase 2.5s infinite linear both;
|
|
1724
|
+
}
|
|
1725
|
+
|
|
1726
|
+
.sk-chase-dot {
|
|
1727
|
+
width: 100%;
|
|
1728
|
+
height: 100%;
|
|
1729
|
+
position: absolute;
|
|
1730
|
+
left: 0;
|
|
1731
|
+
top: 0;
|
|
1732
|
+
animation: sk-chase-dot 2.0s infinite ease-in-out both;
|
|
1733
|
+
}
|
|
1734
|
+
|
|
1735
|
+
.sk-chase-dot:before {
|
|
1736
|
+
content: '';
|
|
1737
|
+
display: block;
|
|
1738
|
+
width: 25%;
|
|
1739
|
+
height: 25%;
|
|
1740
|
+
background-color: #212121;
|
|
1741
|
+
border-radius: 100%;
|
|
1742
|
+
animation: sk-chase-dot-before 2.0s infinite ease-in-out both;
|
|
1743
|
+
}
|
|
1744
|
+
|
|
1745
|
+
.sk-chase-dot:nth-child(1) {
|
|
1746
|
+
animation-delay: -1.1s;
|
|
1747
|
+
}
|
|
1748
|
+
|
|
1749
|
+
.sk-chase-dot:nth-child(2) {
|
|
1750
|
+
animation-delay: -1.0s;
|
|
1751
|
+
}
|
|
1752
|
+
|
|
1753
|
+
.sk-chase-dot:nth-child(3) {
|
|
1754
|
+
animation-delay: -0.9s;
|
|
1755
|
+
}
|
|
1756
|
+
|
|
1757
|
+
.sk-chase-dot:nth-child(4) {
|
|
1758
|
+
animation-delay: -0.8s;
|
|
1759
|
+
}
|
|
1760
|
+
|
|
1761
|
+
.sk-chase-dot:nth-child(5) {
|
|
1762
|
+
animation-delay: -0.7s;
|
|
1763
|
+
}
|
|
1764
|
+
|
|
1765
|
+
.sk-chase-dot:nth-child(6) {
|
|
1766
|
+
animation-delay: -0.6s;
|
|
1767
|
+
}
|
|
1768
|
+
|
|
1769
|
+
.sk-chase-dot:nth-child(1):before {
|
|
1770
|
+
animation-delay: -1.1s;
|
|
1771
|
+
}
|
|
1772
|
+
|
|
1773
|
+
.sk-chase-dot:nth-child(2):before {
|
|
1774
|
+
animation-delay: -1.0s;
|
|
1775
|
+
}
|
|
1776
|
+
|
|
1777
|
+
.sk-chase-dot:nth-child(3):before {
|
|
1778
|
+
animation-delay: -0.9s;
|
|
1779
|
+
}
|
|
1780
|
+
|
|
1781
|
+
.sk-chase-dot:nth-child(4):before {
|
|
1782
|
+
animation-delay: -0.8s;
|
|
1783
|
+
}
|
|
1784
|
+
|
|
1785
|
+
.sk-chase-dot:nth-child(5):before {
|
|
1786
|
+
animation-delay: -0.7s;
|
|
1787
|
+
}
|
|
1788
|
+
|
|
1789
|
+
.sk-chase-dot:nth-child(6):before {
|
|
1790
|
+
animation-delay: -0.6s;
|
|
1791
|
+
}
|
|
1792
|
+
|
|
1793
|
+
@keyframes sk-chase {
|
|
1794
|
+
100% {
|
|
1795
|
+
transform: rotate(360deg);
|
|
1796
|
+
}
|
|
1797
|
+
}
|
|
1798
|
+
|
|
1799
|
+
@keyframes sk-chase-dot {
|
|
1800
|
+
|
|
1801
|
+
80%,
|
|
1802
|
+
100% {
|
|
1803
|
+
transform: rotate(360deg);
|
|
1804
|
+
}
|
|
1805
|
+
}
|
|
1806
|
+
|
|
1807
|
+
@keyframes sk-chase-dot-before {
|
|
1808
|
+
50% {
|
|
1809
|
+
transform: scale(0.4);
|
|
1810
|
+
}
|
|
1811
|
+
|
|
1812
|
+
100%,
|
|
1813
|
+
0% {
|
|
1814
|
+
transform: scale(1.0);
|
|
1815
|
+
}
|
|
1816
|
+
}
|
|
1817
|
+
</style>
|
|
1404
1818
|
`,
|
|
1405
1819
|
standalone: true,
|
|
1406
1820
|
}]
|
|
@@ -1531,7 +1945,7 @@ class BillWorkflowComponent {
|
|
|
1531
1945
|
}
|
|
1532
1946
|
}
|
|
1533
1947
|
else {
|
|
1534
|
-
this.toasterService.error(res?.error[0]);
|
|
1948
|
+
this.toasterService.error(this.translationService.translate(res?.error[0]));
|
|
1535
1949
|
this.proceedToBillReview();
|
|
1536
1950
|
}
|
|
1537
1951
|
},
|
|
@@ -2507,7 +2921,7 @@ class WorkFlowComponent {
|
|
|
2507
2921
|
},
|
|
2508
2922
|
],
|
|
2509
2923
|
}),
|
|
2510
|
-
], ngImport: i0, template: "\n\n@if (showWorkflowComponent) {\n \n <sdk-bill-workflow \n [selectedBill]=\"selectedBillForWorkflow\"\n (workflowCompleted)=\"onWorkflowCompleted($event)\">\n </sdk-bill-workflow>\n \n \n}@else { \n <div class=\"content work-flow-content\">\n <header class=\"page-header work-flow-page-header d-flex align-items-center justify-content-between container-fluid\">\n <h1 class=\"page-title work-flow-page-title m-0\">{{ 'LABEL_UTILITIES' | translate }}</h1>\n <button type=\"button\" class=\"btn btn-outline-secondary btn-sm\" (click)=\"back()\">\n <i class=\"fas fa-angle-left me-1\"></i>{{ 'COMMON_LABEL_BACK' | translate }}\n </button>\n </header>\n \n <section class=\"page-content container-fluid work-flow-section\">\n \n <div class=\"card work-flow-card m-0\">\n <div class=\"card-header work-flow-card-header\">\n <h4 class=\"card-title work-flow-card-title m-0 text-dark\">{{ vendorProvider?.provider_name }}</h4>\n </div>\n <div class=\"tab-content\">\n <div class=\"tab-pane fadeIn active show\">\n <form role=\"form\" class=\"form-horizontal work-flow-form\" [formGroup]=\"detailsForm\" (ngSubmit)=\"submitForm()\">\n <div class=\"card-body work-flow-card-body\">\n <div class=\"work-flow-fields\">\n @if (fieldsArray.length > 0) {\n <div class=\"row justify-content-center\">\n <div class=\"col-12 work-flow-form-column\">\n <!-- <div class=\"form-group form-row\">\n <label\n class=\"control-label text-md-right col-md-4 col-lg-3\">Provider</label>\n <div class=\"col-md-5\">\n <ng-select placeholder=\"Select Provider\" bindLabel=\"provider_name\"\n bindValue=\"id\" [items]=\"vendorProviders\"\n (change)=\"changeVendorProvider($event)\">\n </ng-select>\n </div>\n </div> -->\n <!-- <pre>{{fieldsArray|json}}</pre> -->\n <formly-form [fields]=\"fieldsArray\" [model]=\"fieldsModel\" [form]=\"detailsForm\">\n </formly-form>\n </div>\n </div>\n }\n \n @if (fieldsArray.length === 0) {\n <sdk-no-data title=\"LABEL_FIELDS_NOT_AVAILABLE\"></sdk-no-data>\n }\n </div>\n </div>\n <div class=\"card-footer work-flow-footer bg-light d-flex justify-content-end flex-wrap gap-2\">\n <button type=\"button\" class=\"btn btn-secondary btn-sm\" (click)=\"back()\">\n {{'COMMON_LABEL_CANCEL' | translate}}\n </button>\n @if (buttonData) {\n <button type=\"submit\" class=\"btn btn-primary btn-sm\"\n [ngClass]=\"{'qt-loader qt-loader-mini qt-loader-left': showLoader}\"\n [disabled]=\"showLoader || !detailsForm.valid\">\n {{ buttonData?.field_title }}\n </button>\n }\n </div>\n </form>\n </div>\n </div>\n </div>\n </section>\n </div>\n}\n\n<style>\n .work-flow-content {\n overflow: visible;\n }\n\n .work-flow-page-header {\n margin-bottom: 0.5rem;\n }\n\n .work-flow-page-title {\n font-size: 0.95rem;\n font-weight: 600;\n color: #1e3a5f;\n }\n\n .work-flow-section {\n max-width: 100%;\n padding-left: 0.75rem;\n padding-right: 0.75rem;\n }\n\n /* Narrow card: less empty chrome */\n .work-flow-card {\n max-width: 440px;\n margin-left: auto;\n margin-right: auto;\n border: 1px solid #e9ecef;\n border-radius: 6px;\n box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);\n overflow: visible;\n }\n\n .work-flow-card-header {\n background: #f8f9fa;\n border-bottom: 1px solid #e9ecef;\n padding: 0.4rem 0.6rem;\n }\n\n .work-flow-card-title {\n font-size: 0.85rem;\n font-weight: 600;\n color: #1e3a5f;\n }\n\n .work-flow-card-body {\n padding: 0.85rem 0.75rem 1rem;\n border-bottom: 1px solid #e9ecef;\n }\n\n .work-flow-fields {\n margin-top: 0;\n }\n\n .work-flow-form-column {\n max-width: 100%;\n margin-left: 0;\n margin-right: 0;\n padding-left: 0;\n padding-right: 0;\n }\n\n .work-flow-footer {\n padding: 0.45rem 0.6rem;\n border-top: 1px solid #e9ecef;\n background: #fafbfc !important;\n }\n\n .work-flow-footer .btn {\n font-size: 0.7rem;\n padding: 0.18rem 0.45rem;\n line-height: 1.15;\n border-radius: 3px;\n }\n\n /*\n * Reference layout: each row centered in the card; compact inputs (~25\u201330% of card);\n * labels right-aligned next to the field.\n */\n .work-flow-card-body ::ng-deep formly-field {\n display: block;\n width: 100%;\n }\n\n .work-flow-card-body ::ng-deep .form-group.form-row {\n max-width: 100%;\n margin-left: 0;\n margin-right: 0;\n margin-bottom: 0.65rem;\n align-items: center;\n flex-wrap: nowrap;\n justify-content: flex-start;\n }\n\n .work-flow-card-body ::ng-deep .form-group.form-row > .control-label {\n flex: 0 0 8rem;\n max-width: 8rem;\n min-width: 8rem;\n font-size: 0.72rem;\n font-weight: 500;\n color: #3d5a80;\n padding-top: 0;\n padding-right: 0.45rem;\n margin-bottom: 0;\n text-align: right;\n white-space: nowrap;\n }\n\n .work-flow-card-body ::ng-deep .form-group.form-row > .col-md-8 {\n flex: 1 1 auto;\n max-width: none;\n width: auto;\n min-width: 0;\n }\n\n .work-flow-card-body ::ng-deep .form-control {\n display: block;\n width: 100%;\n max-width: 200px;\n box-sizing: border-box;\n font-size: 0.72rem;\n min-height: 26px;\n height: 26px;\n padding: 0.15rem 0.4rem;\n border-radius: 4px;\n line-height: 1.2;\n border: 1px solid #d8dee6;\n background-color: #fff;\n color: #334155;\n }\n\n .work-flow-card-body ::ng-deep .form-control::placeholder {\n color: #94a3b8;\n opacity: 1;\n font-size: 0.7rem;\n }\n\n .work-flow-card-body ::ng-deep textarea.form-control {\n height: auto !important;\n min-height: 3.25rem;\n max-width: 100%;\n }\n\n .work-flow-card-body ::ng-deep .invalid-feedback {\n font-size: 0.65rem;\n margin-top: 0.1rem;\n }\n\n @media (max-width: 400px) {\n .work-flow-card {\n max-width: 100%;\n }\n\n .work-flow-card-body ::ng-deep .form-control {\n max-width: 100%;\n }\n }\n\n</style>", styles: [".work-flow-content{overflow:visible}.work-flow-page-header{margin-bottom:.5rem}.work-flow-page-title{font-size:.95rem;font-weight:600;color:#1e3a5f}.work-flow-section{max-width:100%;padding-left:.75rem;padding-right:.75rem}.work-flow-card{max-width:440px;margin-left:auto;margin-right:auto;border:1px solid #e9ecef;border-radius:6px;box-shadow:0 1px 3px #0000000f;overflow:visible}.work-flow-card-header{background:#f8f9fa;border-bottom:1px solid #e9ecef;padding:.4rem .6rem}.work-flow-card-title{font-size:.85rem;font-weight:600;color:#1e3a5f}.work-flow-card-body{padding:.85rem .75rem 1rem;border-bottom:1px solid #e9ecef}.work-flow-fields{margin-top:0}.work-flow-form-column{max-width:100%;margin-left:0;margin-right:0;padding-left:0;padding-right:0}.work-flow-footer{padding:.45rem .6rem;border-top:1px solid #e9ecef;background:#fafbfc!important}.work-flow-footer .btn{font-size:.7rem;padding:.18rem .45rem;line-height:1.15;border-radius:3px}.work-flow-card-body ::ng-deep formly-field{display:block;width:100%}.work-flow-card-body ::ng-deep .form-group.form-row{max-width:100%;margin-left:0;margin-right:0;margin-bottom:.65rem;align-items:center;flex-wrap:nowrap;justify-content:flex-start}.work-flow-card-body ::ng-deep .form-group.form-row>.control-label{flex:0 0 8rem;max-width:8rem;min-width:8rem;font-size:.72rem;font-weight:500;color:#3d5a80;padding-top:0;padding-right:.45rem;margin-bottom:0;text-align:right;white-space:nowrap}.work-flow-card-body ::ng-deep .form-group.form-row>.col-md-8{flex:1 1 auto;max-width:none;width:auto;min-width:0}.work-flow-card-body ::ng-deep .form-control{display:block;width:100%;max-width:200px;box-sizing:border-box;font-size:.72rem;min-height:26px;height:26px;padding:.15rem .4rem;border-radius:4px;line-height:1.2;border:1px solid #d8dee6;background-color:#fff;color:#334155}.work-flow-card-body ::ng-deep .form-control::placeholder{color:#94a3b8;opacity:1;font-size:.7rem}.work-flow-card-body ::ng-deep textarea.form-control{height:auto!important;min-height:3.25rem;max-width:100%}.work-flow-card-body ::ng-deep .invalid-feedback{font-size:.65rem;margin-top:.1rem}@media (max-width: 400px){.work-flow-card{max-width:100%}.work-flow-card-body ::ng-deep .form-control{max-width:100%}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: SharedModule }, { kind: "ngmodule", type: NgSelectModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyBootstrapModule }, { kind: "ngmodule", type: FormlyModule }, { kind: "component", type: i1$2.LegacyFormlyForm, selector: "formly-form" }, { kind: "component", type: NoDataComponent, selector: "sdk-no-data", inputs: ["title", "icon"] }, { kind: "component", type: BillWorkflowComponent, selector: "sdk-bill-workflow", inputs: ["billData", "selectedBill"], outputs: ["workflowCompleted"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
|
|
2924
|
+
], ngImport: i0, template: "\n\n@if (showWorkflowComponent) {\n \n <sdk-bill-workflow \n [selectedBill]=\"selectedBillForWorkflow\"\n (workflowCompleted)=\"onWorkflowCompleted($event)\">\n </sdk-bill-workflow>\n \n \n}@else { \n <div class=\"content\">\n <header class=\"page-header\">\n <div class=\"d-flex align-items-center flex-wrap\">\n <div class=\"mr-auto\">\n <h1>{{ 'LABEL_UTILITIES' | translate }}</h1>\n </div>\n </div>\n </header>\n \n <section class=\"page-content container-fluid\">\n \n <div class=\"card m-0 border-0\">\n <div class=\"card-header p-t-25 p-b-20\">\n <h4 class=\"card-title font-weight-600 font-size-18 m-0 text-dark\">{{ vendorProvider?.provider_name }}\n </h4>\n </div>\n <div class=\"tab-content\">\n <div class=\"tab-pane fadeIn active show\">\n <form role=\"form\" class=\"form-horizontal\" [formGroup]=\"detailsForm\" (ngSubmit)=\"submitForm()\">\n <div class=\"card-body\">\n <div class=\"mt-3\">\n @if (fieldsArray.length > 0) {\n <div class=\"row\">\n <div class=\"col-xl-5 offset-xl-3\">\n <!-- <div class=\"form-group form-row\">\n <label\n class=\"control-label text-md-right col-md-4 col-lg-3\">Provider</label>\n <div class=\"col-md-5\">\n <ng-select placeholder=\"Select Provider\" bindLabel=\"provider_name\"\n bindValue=\"id\" [items]=\"vendorProviders\"\n (change)=\"changeVendorProvider($event)\">\n </ng-select>\n </div>\n </div> -->\n <!-- <pre>{{fieldsArray|json}}</pre> -->\n <formly-form [fields]=\"fieldsArray\" [model]=\"fieldsModel\" [form]=\"detailsForm\">\n </formly-form>\n </div>\n </div>\n }\n \n @if (fieldsArray.length === 0) {\n <sdk-no-data title=\"LABEL_FIELDS_NOT_AVAILABLE\"></sdk-no-data>\n }\n </div>\n </div>\n <div class=\"card-footer bg-light text-right\">\n <button type=\"button\" class=\"btn btn-secondary\" (click)=\"back()\">\n {{'COMMON_LABEL_CANCEL' | translate}}\n </button>\n @if (buttonData) {\n <button type=\"submit\" class=\"btn btn-primary\"\n [ngClass]=\"{'qt-loader qt-loader-mini qt-loader-left': showLoader}\"\n [disabled]=\"showLoader\">\n {{ buttonData?.field_title }}\n </button>\n }\n </div>\n </form>\n </div>\n </div>\n </div>\n </section>\n </div>\n}", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: SharedModule }, { kind: "ngmodule", type: NgSelectModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyBootstrapModule }, { kind: "ngmodule", type: FormlyModule }, { kind: "component", type: i1$2.LegacyFormlyForm, selector: "formly-form" }, { kind: "component", type: NoDataComponent, selector: "sdk-no-data", inputs: ["title", "icon"] }, { kind: "component", type: BillWorkflowComponent, selector: "sdk-bill-workflow", inputs: ["billData", "selectedBill"], outputs: ["workflowCompleted"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
|
|
2511
2925
|
}
|
|
2512
2926
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: WorkFlowComponent, decorators: [{
|
|
2513
2927
|
type: Component,
|
|
@@ -2557,7 +2971,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
|
|
|
2557
2971
|
},
|
|
2558
2972
|
],
|
|
2559
2973
|
}),
|
|
2560
|
-
], template: "\n\n@if (showWorkflowComponent) {\n \n <sdk-bill-workflow \n [selectedBill]=\"selectedBillForWorkflow\"\n (workflowCompleted)=\"onWorkflowCompleted($event)\">\n </sdk-bill-workflow>\n \n \n}@else { \n <div class=\"content
|
|
2974
|
+
], template: "\n\n@if (showWorkflowComponent) {\n \n <sdk-bill-workflow \n [selectedBill]=\"selectedBillForWorkflow\"\n (workflowCompleted)=\"onWorkflowCompleted($event)\">\n </sdk-bill-workflow>\n \n \n}@else { \n <div class=\"content\">\n <header class=\"page-header\">\n <div class=\"d-flex align-items-center flex-wrap\">\n <div class=\"mr-auto\">\n <h1>{{ 'LABEL_UTILITIES' | translate }}</h1>\n </div>\n </div>\n </header>\n \n <section class=\"page-content container-fluid\">\n \n <div class=\"card m-0 border-0\">\n <div class=\"card-header p-t-25 p-b-20\">\n <h4 class=\"card-title font-weight-600 font-size-18 m-0 text-dark\">{{ vendorProvider?.provider_name }}\n </h4>\n </div>\n <div class=\"tab-content\">\n <div class=\"tab-pane fadeIn active show\">\n <form role=\"form\" class=\"form-horizontal\" [formGroup]=\"detailsForm\" (ngSubmit)=\"submitForm()\">\n <div class=\"card-body\">\n <div class=\"mt-3\">\n @if (fieldsArray.length > 0) {\n <div class=\"row\">\n <div class=\"col-xl-5 offset-xl-3\">\n <!-- <div class=\"form-group form-row\">\n <label\n class=\"control-label text-md-right col-md-4 col-lg-3\">Provider</label>\n <div class=\"col-md-5\">\n <ng-select placeholder=\"Select Provider\" bindLabel=\"provider_name\"\n bindValue=\"id\" [items]=\"vendorProviders\"\n (change)=\"changeVendorProvider($event)\">\n </ng-select>\n </div>\n </div> -->\n <!-- <pre>{{fieldsArray|json}}</pre> -->\n <formly-form [fields]=\"fieldsArray\" [model]=\"fieldsModel\" [form]=\"detailsForm\">\n </formly-form>\n </div>\n </div>\n }\n \n @if (fieldsArray.length === 0) {\n <sdk-no-data title=\"LABEL_FIELDS_NOT_AVAILABLE\"></sdk-no-data>\n }\n </div>\n </div>\n <div class=\"card-footer bg-light text-right\">\n <button type=\"button\" class=\"btn btn-secondary\" (click)=\"back()\">\n {{'COMMON_LABEL_CANCEL' | translate}}\n </button>\n @if (buttonData) {\n <button type=\"submit\" class=\"btn btn-primary\"\n [ngClass]=\"{'qt-loader qt-loader-mini qt-loader-left': showLoader}\"\n [disabled]=\"showLoader\">\n {{ buttonData?.field_title }}\n </button>\n }\n </div>\n </form>\n </div>\n </div>\n </div>\n </section>\n </div>\n}" }]
|
|
2561
2975
|
}], ctorParameters: () => [] });
|
|
2562
2976
|
|
|
2563
2977
|
const REGION_COMMUNE_DATA = {
|
|
@@ -3134,6 +3548,7 @@ class ViewBillsComponent {
|
|
|
3134
3548
|
router = inject(Router);
|
|
3135
3549
|
dataService = inject(DataService);
|
|
3136
3550
|
sdkState = inject(SdkStateService, { optional: true });
|
|
3551
|
+
translationService = inject(TranslationService);
|
|
3137
3552
|
currency = null;
|
|
3138
3553
|
showLoader = false;
|
|
3139
3554
|
billsData = null;
|
|
@@ -3227,7 +3642,7 @@ class ViewBillsComponent {
|
|
|
3227
3642
|
this.billsData = res?.data;
|
|
3228
3643
|
}
|
|
3229
3644
|
else {
|
|
3230
|
-
this.toasterService.error(res?.error[0]);
|
|
3645
|
+
this.toasterService.error(this.translationService.translate(res?.error[0]));
|
|
3231
3646
|
}
|
|
3232
3647
|
},
|
|
3233
3648
|
});
|
|
@@ -3298,7 +3713,7 @@ class ViewBillsComponent {
|
|
|
3298
3713
|
}
|
|
3299
3714
|
}
|
|
3300
3715
|
else {
|
|
3301
|
-
this.toasterService.error(res?.error[0]);
|
|
3716
|
+
this.toasterService.error(this.translationService.translate(res?.error[0]));
|
|
3302
3717
|
this.topupAndBillpaymentService.saveBillData({
|
|
3303
3718
|
selectedBill: billData,
|
|
3304
3719
|
user_info: this.billsData?.user_info
|
|
@@ -4286,7 +4701,7 @@ class TopupAndBillpaymentReviewComponent extends TransactionClass {
|
|
|
4286
4701
|
if (response.success) {
|
|
4287
4702
|
clearInterval(this.interval);
|
|
4288
4703
|
this.hideModal("OTPVerification");
|
|
4289
|
-
this.toasterService.success(response?.data?.message);
|
|
4704
|
+
this.toasterService.success(this.translationService.translate(response?.data?.message));
|
|
4290
4705
|
if (this.inValidTxnPin) {
|
|
4291
4706
|
this.inValidTxnPin = false;
|
|
4292
4707
|
this.isTxnPinCreated = false;
|
|
@@ -4301,7 +4716,7 @@ class TopupAndBillpaymentReviewComponent extends TransactionClass {
|
|
|
4301
4716
|
this.otpReset = true;
|
|
4302
4717
|
}
|
|
4303
4718
|
else {
|
|
4304
|
-
this.toasterService.error(response?.error[0]);
|
|
4719
|
+
this.toasterService.error(this.translationService.translate(response?.error[0]));
|
|
4305
4720
|
}
|
|
4306
4721
|
},
|
|
4307
4722
|
error: () => {
|
|
@@ -4383,7 +4798,7 @@ class TopupAndBillpaymentReviewComponent extends TransactionClass {
|
|
|
4383
4798
|
next: (response) => {
|
|
4384
4799
|
this.showLoader = false;
|
|
4385
4800
|
if (response.success) {
|
|
4386
|
-
this.toasterService.success(response?.data?.message);
|
|
4801
|
+
this.toasterService.success(this.translationService.translate(response?.data?.message));
|
|
4387
4802
|
this.showModal("OTPVerification");
|
|
4388
4803
|
if (this.otpResendTime > 0) {
|
|
4389
4804
|
this.timer = this.otpResendTime;
|
|
@@ -4398,7 +4813,7 @@ class TopupAndBillpaymentReviewComponent extends TransactionClass {
|
|
|
4398
4813
|
}
|
|
4399
4814
|
}
|
|
4400
4815
|
else {
|
|
4401
|
-
this.toasterService.error(response?.error[0]);
|
|
4816
|
+
this.toasterService.error(this.translationService.translate(response?.error[0]));
|
|
4402
4817
|
}
|
|
4403
4818
|
},
|
|
4404
4819
|
error: () => {
|
|
@@ -4453,7 +4868,7 @@ class TopupAndBillpaymentReviewComponent extends TransactionClass {
|
|
|
4453
4868
|
|| error?.error?.error
|
|
4454
4869
|
|| error?.error?.message
|
|
4455
4870
|
|| this.translationService.translate("LABEL_SOMETHING_WENT_WRONG");
|
|
4456
|
-
this.toasterService.error(apiError);
|
|
4871
|
+
this.toasterService.error(this.translationService.translate(apiError));
|
|
4457
4872
|
},
|
|
4458
4873
|
});
|
|
4459
4874
|
}
|
|
@@ -4475,12 +4890,12 @@ class TopupAndBillpaymentReviewComponent extends TransactionClass {
|
|
|
4475
4890
|
next: (res) => {
|
|
4476
4891
|
this.showLoader = false;
|
|
4477
4892
|
if (res?.success) {
|
|
4478
|
-
this.toasterService.success(res?.data.message);
|
|
4893
|
+
this.toasterService.success(this.translationService.translate(res?.data.message));
|
|
4479
4894
|
this.createSession(this.enteredPIN ?? undefined);
|
|
4480
4895
|
this.hideModal("ConfirmTransactionPIN");
|
|
4481
4896
|
}
|
|
4482
4897
|
else {
|
|
4483
|
-
this.toasterService.error(res?.error[0]);
|
|
4898
|
+
this.toasterService.error(this.translationService.translate(res?.error[0]));
|
|
4484
4899
|
}
|
|
4485
4900
|
},
|
|
4486
4901
|
error: () => {
|
|
@@ -4687,7 +5102,7 @@ class TopupAndBillpaymentReviewComponent extends TransactionClass {
|
|
|
4687
5102
|
this.latestTransactionPayload = txnPayload;
|
|
4688
5103
|
// txnPayload.amount = Math.floor(Math.random() + Math.floor(Math.random() + 2))
|
|
4689
5104
|
if (!this.proceedToPayment) {
|
|
4690
|
-
this.toasterService.error('LABEL_BILL_OVER_DUE');
|
|
5105
|
+
this.toasterService.error(this.translationService.translate('LABEL_BILL_OVER_DUE'));
|
|
4691
5106
|
this.showLoader = false;
|
|
4692
5107
|
return;
|
|
4693
5108
|
}
|
|
@@ -4735,23 +5150,23 @@ class TopupAndBillpaymentReviewComponent extends TransactionClass {
|
|
|
4735
5150
|
}
|
|
4736
5151
|
else {
|
|
4737
5152
|
this.showLoader = false;
|
|
4738
|
-
this.toasterService.error(statusResponse?.error
|
|
5153
|
+
this.toasterService.error(this.translationService.translate(statusResponse?.error[0] || "LABEL_SOMETHING_WENT_WRONG"));
|
|
4739
5154
|
}
|
|
4740
5155
|
},
|
|
4741
5156
|
error: (statusError) => {
|
|
4742
5157
|
this.showLoader = false;
|
|
4743
|
-
this.toasterService.error(statusError?.error?.error ||
|
|
5158
|
+
this.toasterService.error(this.translationService.translate(statusError?.error?.error || "LABEL_SOMETHING_WENT_WRONG"));
|
|
4744
5159
|
},
|
|
4745
5160
|
});
|
|
4746
5161
|
}
|
|
4747
5162
|
else {
|
|
4748
5163
|
this.showLoader = false;
|
|
4749
|
-
this.toasterService.error(payBillResponse?.error?.[0] ||
|
|
5164
|
+
this.toasterService.error(this.translationService.translate(payBillResponse?.error?.[0] || "LABEL_SOMETHING_WENT_WRONG"));
|
|
4750
5165
|
}
|
|
4751
5166
|
},
|
|
4752
5167
|
error: (payBillError) => {
|
|
4753
5168
|
this.showLoader = false;
|
|
4754
|
-
this.toasterService.error(payBillError?.error?.error ||
|
|
5169
|
+
this.toasterService.error(this.translationService.translate(payBillError?.error?.error || "LABEL_SOMETHING_WENT_WRONG"));
|
|
4755
5170
|
},
|
|
4756
5171
|
});
|
|
4757
5172
|
}
|
|
@@ -4835,34 +5250,34 @@ class TopupAndBillpaymentReviewComponent extends TransactionClass {
|
|
|
4835
5250
|
}
|
|
4836
5251
|
else {
|
|
4837
5252
|
this.showLoader = false;
|
|
4838
|
-
this.toasterService.error(statusResponse?.error?.[0] ||
|
|
5253
|
+
this.toasterService.error(this.translationService.translate(statusResponse?.error?.[0] || "LABEL_SOMETHING_WENT_WRONG"));
|
|
4839
5254
|
}
|
|
4840
5255
|
},
|
|
4841
5256
|
error: (statusError) => {
|
|
4842
5257
|
this.showLoader = false;
|
|
4843
|
-
this.toasterService.error(statusError?.error?.error ||
|
|
5258
|
+
this.toasterService.error(this.translationService.translate(statusError?.error?.error || "LABEL_SOMETHING_WENT_WRONG"));
|
|
4844
5259
|
},
|
|
4845
5260
|
});
|
|
4846
5261
|
}
|
|
4847
5262
|
else {
|
|
4848
5263
|
this.showLoader = false;
|
|
4849
|
-
this.toasterService.error(payBillResponse?.error?.[0] ||
|
|
5264
|
+
this.toasterService.error(this.translationService.translate(payBillResponse?.error?.[0] || "LABEL_SOMETHING_WENT_WRONG"));
|
|
4850
5265
|
}
|
|
4851
5266
|
},
|
|
4852
5267
|
error: (payBillError) => {
|
|
4853
5268
|
this.showLoader = false;
|
|
4854
|
-
this.toasterService.error(payBillError?.error?.error ||
|
|
5269
|
+
this.toasterService.error(this.translationService.translate(payBillError?.error?.error || "LABEL_SOMETHING_WENT_WRONG"));
|
|
4855
5270
|
},
|
|
4856
5271
|
});
|
|
4857
5272
|
}
|
|
4858
5273
|
else {
|
|
4859
5274
|
this.showLoader = false;
|
|
4860
|
-
this.toasterService.error(response?.error[0]);
|
|
5275
|
+
this.toasterService.error(this.translationService.translate(response?.error[0]));
|
|
4861
5276
|
}
|
|
4862
5277
|
},
|
|
4863
5278
|
error: (error) => {
|
|
4864
5279
|
this.showLoader = false;
|
|
4865
|
-
this.toasterService.error(error?.error?.error);
|
|
5280
|
+
this.toasterService.error(this.translationService.translate(error?.error?.error));
|
|
4866
5281
|
},
|
|
4867
5282
|
});
|
|
4868
5283
|
}
|