@bnsights/bbsf-controls 1.0.9 → 1.0.10

package/bundles/bnsights-bbsf-controls.umd.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@fullcalendar/angular'), require('@fullcalendar/daygrid'), require('@fullcalendar/timegrid'), require('@fullcalendar/list'), require('@fullcalendar/interaction'), require('@angular/core'), require('ng-block-ui'), require('@angular/forms'), require('@angular/http'), require('@angular/router'), require('ngx-toastr'), require('ngx-permissions'), require('@angular/cdk/overlay'), require('@ngrx/store-devtools'), require('@angular/common'), require('ngx-intl-tel-input'), require('@bnsights/bbsf-utilities'), require('ngx-bootstrap/datepicker'), require('rxjs'), require('ng2-file-upload'), require('ng-pick-datetime'), require('ng-multiselect-dropdown'), require('angular2-multiselect-dropdown'), require('ngx-summernote'), require('ngx-mask'), require('@syncfusion/ej2-angular-popups'), require('ngx-dropzone'), require('angular-cropperjs'), require('ngx-image-cropper'), require('@ng-bootstrap/ng-bootstrap'), require('@ngx-translate/core'), require('@angular/common/http'), require('ngx-typeahead'), require('rxjs/operators'), require('ngx-tags-input'), require('@ng-select/ng-select'), require('ngx-infinite-scroll'), require('@agm/core'), require('@angular-material-extensions/google-maps-autocomplete'), require('@fullcalendar/core/locales/en-gb'), require('@fullcalendar/core/locales/ar'), require('ngx-bootstrap/typeahead'), require('@angular/material/slide-toggle'), require('@kolkov/angular-editor'), require('angular-ng-autocomplete'), require('ng-inline-svg')) :
-    typeof define === 'function' && define.amd ? define('@bnsights/bbsf-controls', ['exports', '@fullcalendar/angular', '@fullcalendar/daygrid', '@fullcalendar/timegrid', '@fullcalendar/list', '@fullcalendar/interaction', '@angular/core', 'ng-block-ui', '@angular/forms', '@angular/http', '@angular/router', 'ngx-toastr', 'ngx-permissions', '@angular/cdk/overlay', '@ngrx/store-devtools', '@angular/common', 'ngx-intl-tel-input', '@bnsights/bbsf-utilities', 'ngx-bootstrap/datepicker', 'rxjs', 'ng2-file-upload', 'ng-pick-datetime', 'ng-multiselect-dropdown', 'angular2-multiselect-dropdown', 'ngx-summernote', 'ngx-mask', '@syncfusion/ej2-angular-popups', 'ngx-dropzone', 'angular-cropperjs', 'ngx-image-cropper', '@ng-bootstrap/ng-bootstrap', '@ngx-translate/core', '@angular/common/http', 'ngx-typeahead', 'rxjs/operators', 'ngx-tags-input', '@ng-select/ng-select', 'ngx-infinite-scroll', '@agm/core', '@angular-material-extensions/google-maps-autocomplete', '@fullcalendar/core/locales/en-gb', '@fullcalendar/core/locales/ar', 'ngx-bootstrap/typeahead', '@angular/material/slide-toggle', '@kolkov/angular-editor', 'angular-ng-autocomplete', 'ng-inline-svg'], factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.bnsights = global.bnsights || {}, global.bnsights["bbsf-controls"] = {}), global.angular, global.dayGridPlugin, global.timeGridPlugin, global.listPlugin, global.interactionPlugin, global.ng.core, global.ngBlockUi, global.ng.forms, global.ng.http, global.ng.router, global.ngxToastr, global.ngxPermissions, global.ng.cdk.overlay, global.storeDevtools, global.ng.common, global.ngxIntlTelInput, global.bbsfUtilities, global.datepicker, global.rxjs, global.ng2FileUpload, global.ngPickDatetime, global.ngMultiselectDropdown, global.angular2MultiselectDropdown, global.ngxSummernote, global.ngxMask, global.ej2AngularPopups, global.ngxDropzone, global.angularCropperjs, global.ngxImageCropper, global.ngBootstrap, global.core$1, global.ng.common.http, global.ngxTypeahead, global.rxjs.operators, global.ngxTagsInput, global.ngSelect, global.ngxInfiniteScroll, global.core, global.googleMapsAutocomplete, global.enGbLocale, global.ArLocale, global.typeahead, global.ng.material.slideToggle, global.angularEditor, global.angularNgAutocomplete, global.ngInlineSvg));
-})(this, (function (exports, angular, dayGridPlugin, timeGridPlugin, listPlugin, interactionPlugin, i0, ngBlockUi, forms, http, router, ngxToastr, ngxPermissions, overlay, storeDevtools, common, ngxIntlTelInput, bbsfUtilities, datepicker, rxjs, ng2FileUpload, ngPickDatetime, ngMultiselectDropdown, angular2MultiselectDropdown, ngxSummernote, ngxMask, ej2AngularPopups, ngxDropzone, angularCropperjs, ngxImageCropper, ngBootstrap, core$1, http$1, ngxTypeahead, operators, ngxTagsInput, ngSelect, ngxInfiniteScroll, core, googleMapsAutocomplete, enGbLocale, ArLocale, typeahead, slideToggle, angularEditor, angularNgAutocomplete, ngInlineSvg) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@fullcalendar/angular'), require('@fullcalendar/daygrid'), require('@fullcalendar/timegrid'), require('@fullcalendar/list'), require('@fullcalendar/interaction'), require('@angular/core'), require('ng-block-ui'), require('@angular/forms'), require('@angular/http'), require('@angular/router'), require('ngx-toastr'), require('ngx-permissions'), require('@angular/cdk/overlay'), require('@ngrx/store-devtools'), require('@angular/common'), require('ngx-intl-tel-input'), require('@bnsights/bbsf-utilities'), require('ngx-bootstrap/datepicker'), require('rxjs'), require('ng2-file-upload'), require('ng-pick-datetime'), require('ng-multiselect-dropdown'), require('angular2-multiselect-dropdown'), require('ngx-summernote'), require('ngx-mask'), require('@syncfusion/ej2-angular-popups'), require('ngx-dropzone'), require('angular-cropperjs'), require('ngx-image-cropper'), require('@ng-bootstrap/ng-bootstrap'), require('@ngx-translate/core'), require('@angular/common/http'), require('ngx-typeahead'), require('rxjs/operators'), require('ngx-tags-input'), require('@ng-select/ng-select'), require('ngx-infinite-scroll'), require('@agm/core'), require('@angular-material-extensions/google-maps-autocomplete'), require('@fullcalendar/core/locales/en-gb'), require('@fullcalendar/core/locales/ar'), require('ngx-bootstrap/typeahead'), require('@angular/material/slide-toggle'), require('@kolkov/angular-editor'), require('angular-ng-autocomplete'), require('ng-inline-svg'), require('sweetalert2'), require('@sweetalert2/ngx-sweetalert2')) :
+    typeof define === 'function' && define.amd ? define('@bnsights/bbsf-controls', ['exports', '@fullcalendar/angular', '@fullcalendar/daygrid', '@fullcalendar/timegrid', '@fullcalendar/list', '@fullcalendar/interaction', '@angular/core', 'ng-block-ui', '@angular/forms', '@angular/http', '@angular/router', 'ngx-toastr', 'ngx-permissions', '@angular/cdk/overlay', '@ngrx/store-devtools', '@angular/common', 'ngx-intl-tel-input', '@bnsights/bbsf-utilities', 'ngx-bootstrap/datepicker', 'rxjs', 'ng2-file-upload', 'ng-pick-datetime', 'ng-multiselect-dropdown', 'angular2-multiselect-dropdown', 'ngx-summernote', 'ngx-mask', '@syncfusion/ej2-angular-popups', 'ngx-dropzone', 'angular-cropperjs', 'ngx-image-cropper', '@ng-bootstrap/ng-bootstrap', '@ngx-translate/core', '@angular/common/http', 'ngx-typeahead', 'rxjs/operators', 'ngx-tags-input', '@ng-select/ng-select', 'ngx-infinite-scroll', '@agm/core', '@angular-material-extensions/google-maps-autocomplete', '@fullcalendar/core/locales/en-gb', '@fullcalendar/core/locales/ar', 'ngx-bootstrap/typeahead', '@angular/material/slide-toggle', '@kolkov/angular-editor', 'angular-ng-autocomplete', 'ng-inline-svg', 'sweetalert2', '@sweetalert2/ngx-sweetalert2'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.bnsights = global.bnsights || {}, global.bnsights["bbsf-controls"] = {}), global.angular, global.dayGridPlugin, global.timeGridPlugin, global.listPlugin, global.interactionPlugin, global.ng.core, global.ngBlockUi, global.ng.forms, global.ng.http, global.ng.router, global.ngxToastr, global.ngxPermissions, global.ng.cdk.overlay, global.storeDevtools, global.ng.common, global.ngxIntlTelInput, global.bbsfUtilities, global.datepicker, global.rxjs, global.ng2FileUpload, global.ngPickDatetime, global.ngMultiselectDropdown, global.angular2MultiselectDropdown, global.ngxSummernote, global.ngxMask, global.ej2AngularPopups, global.ngxDropzone, global.angularCropperjs, global.ngxImageCropper, global.ngBootstrap, global.core$1, global.ng.common.http, global.ngxTypeahead, global.rxjs.operators, global.ngxTagsInput, global.ngSelect, global.ngxInfiniteScroll, global.core, global.googleMapsAutocomplete, global.enGbLocale, global.ArLocale, global.typeahead, global.ng.material.slideToggle, global.angularEditor, global.angularNgAutocomplete, global.ngInlineSvg, global.Swal, global.ngxSweetalert2));
+})(this, (function (exports, angular, dayGridPlugin, timeGridPlugin, listPlugin, interactionPlugin, i0, ngBlockUi, forms, http, router, ngxToastr, ngxPermissions, overlay, storeDevtools, common, ngxIntlTelInput, bbsfUtilities, datepicker, rxjs, ng2FileUpload, ngPickDatetime, ngMultiselectDropdown, angular2MultiselectDropdown, ngxSummernote, ngxMask, ej2AngularPopups, ngxDropzone, angularCropperjs, ngxImageCropper, ngBootstrap, core$1, http$1, ngxTypeahead, operators, ngxTagsInput, ngSelect, ngxInfiniteScroll, core, googleMapsAutocomplete, enGbLocale, ArLocale, typeahead, slideToggle, angularEditor, angularNgAutocomplete, ngInlineSvg, Swal, ngxSweetalert2) { 'use strict';
 
     function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -31,6 +31,7 @@
     var i0__namespace = /*#__PURE__*/_interopNamespace(i0);
     var enGbLocale__default = /*#__PURE__*/_interopDefaultLegacy(enGbLocale);
     var ArLocale__default = /*#__PURE__*/_interopDefaultLegacy(ArLocale);
+    var Swal__default = /*#__PURE__*/_interopDefaultLegacy(Swal);
 
     var ErrorMassageValidation = /** @class */ (function () {
         // tslint:disable-next-line: deprecation
@@ -232,8 +233,8 @@
                 }
             }
         };
-        ControlUtility.prototype.showGlobalError = function () {
-            this.controlValidationService.showGlobalError();
+        ControlUtility.prototype.showGlobalError = function (formId) {
+            this.controlValidationService.showGlobalError(null, formId);
             this.scrollToGlobalErrorMassage();
         };
         ControlUtility.prototype.RemoveRequiredValidation = function (FormControl, ValidationRole, Options) {
@@ -5298,19 +5299,23 @@
     })(exports.PagingActionMode || (exports.PagingActionMode = {}));
 
     var FormComponent = /** @class */ (function () {
-        function FormComponent(utilityService, controlValidationService, modalService, ngbActiveModal) {
+        function FormComponent(controlUtility, utilityService, controlValidationService, modalService, ngbActiveModal) {
+            this.controlUtility = controlUtility;
             this.utilityService = utilityService;
             this.controlValidationService = controlValidationService;
             this.modalService = modalService;
             this.ngbActiveModal = ngbActiveModal;
         }
         FormComponent.prototype.ngOnInit = function () {
+            this.fromName = this.randomString(5);
         };
         FormComponent.prototype.submit = function () {
             var _this = this;
             this.options.FormGroup.markAllAsTouched();
-            if (this.options.FormGroup.invalid)
+            if (this.options.FormGroup.invalid) {
+                this.showGlobalError();
                 return;
+            }
             else {
                 var submitModel = this.options.GetModelFunction();
                 var submittedService = this.options.ServiceSubmitFunction.apply(null, submitModel);
@@ -5359,16 +5364,28 @@
             if (!this.options.DisableBlockUI)
                 this.utilityService.stopBlockUI();
         };
+        FormComponent.prototype.showGlobalError = function () {
+            this.controlUtility.showGlobalError(this.fromName);
+        };
+        FormComponent.prototype.randomString = function (length) {
+            var randomChars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
+            var result = '';
+            for (var i = 0; i < length; i++) {
+                result += randomChars.charAt(Math.floor(Math.random() * randomChars.length));
+            }
+            return result;
+        };
         return FormComponent;
     }());
     FormComponent.decorators = [
         { type: i0.Component, args: [{
                     // tslint:disable-next-line: component-selector
                     selector: 'BBSF-Form',
-                    template: "<form [FormGroup]=\"options.FormGroup\" (ngSubmit)=\"submit()\">\r\n  \r\n  <ng-template #content><ng-content></ng-content></ng-template>\r\n\r\n  <ng-container *ngTemplateOutlet=\"content\"></ng-container>\r\n</form>"
+                    template: "<form id=\"{{fromName}}\" [FormGroup]=\"options.FormGroup\" (ngSubmit)=\"submit()\" > \r\n  \r\n  <ng-template #content><ng-content></ng-content></ng-template>\r\n\r\n  <ng-container *ngTemplateOutlet=\"content\"></ng-container>\r\n</form>"
                 },] }
     ];
     FormComponent.ctorParameters = function () { return [
+        { type: ControlUtility },
         { type: bbsfUtilities.UtilityService },
         { type: bbsfUtilities.ControlValidationService },
         { type: ngBootstrap.NgbModal },
@@ -5390,11 +5407,38 @@
         };
         //Method used to show confirmation modal
         ConfirmationModalComponent.prototype.showModal = function () {
+            var _this = this;
             this.utilityService.startBlockUI();
             //check for options text values
             this.setTextValues();
-            //open modal
-            this.modalService.open(this.confirmationModal);
+            //sweetalert styles//
+            switch (this.options.StyleConfirmationMode) {
+                case this.styleSuccess: {
+                    this.icon = 'success';
+                    this.btnColor = '#50cd89';
+                }
+                case this.styleWarning: {
+                    this.icon = 'warning';
+                    this.btnColor = '#ffc700';
+                }
+                case this.styleDanger: {
+                    this.icon = 'error';
+                    this.btnColor = '#f1416c';
+                }
+            }
+            Swal__default["default"].fire({
+                title: this.options.ConfirmationHeader,
+                text: this.options.ConfirmationBody,
+                icon: this.icon,
+                showCancelButton: true,
+                confirmButtonColor: this.btnColor,
+                cancelButtonColor: '#f5f8fa',
+                showCloseButton: true,
+            }).then(function (result) {
+                if (result.isConfirmed) {
+                    _this.submit();
+                }
+            });
             this.utilityService.stopBlockUI();
         };
         ConfirmationModalComponent.prototype.setTextValues = function () {
@@ -5454,9 +5498,8 @@
     }());
     ConfirmationModalComponent.decorators = [
         { type: i0.Component, args: [{
-                    selector: 'BBSF-ConfirmationModal',
-                    template: "<!--delete Modal-->\r\n<ng-template #confirmationModal let-modal>\r\n  <div class=\"modal-header pb-0 border-0 justify-content-end\">\r\n    <h5 class=\"modal-title\" id=\"exampleModalLabel\"></h5>\r\n    <button type=\"button\" data-dismiss=\"modal\" aria-label=\"Close\" class=\"btn btn-sm btn-icon btn-active-color-primary\" (click)=\"modal.dismiss()\">\r\n      <span class=\"svg-icon svg-icon-1\">\r\n        <span [inlineSVG]=\"'./src/assets/images/arr061.svg'\"></span>\r\n      </span>\r\n    </button>\r\n  </div>\r\n  <div class=\"modal-body scroll-y px-10 px-lg-15 pt-0 pb-15\">\r\n    <div class=\"mb-13 text-center\">\r\n      <h1 class=\"mb-3\">{{options.ConfirmationHeader}}</h1>\r\n    </div>\r\n    <!--Style danger-->\r\n    <div [ngSwitch]=\"options.StyleConfirmationMode\">\r\n      <div *ngSwitchCase=\"styleDanger\" class=\"notice d-flex bg-light-danger rounded border-danger border border-dashed mb-10 p-6\">\r\n        <span class=\"svg-icon svg-icon-2tx svg-icon-danger me-4\">\r\n          <span [inlineSVG]=\"'./src/assets/images/gen044.svg'\"></span>\r\n        </span>\r\n\r\n        <div class=\"d-flex flex-stack flex-grow-1\">\r\n          <div class=\"fw-bold\">\r\n            <div class=\"fs-6 text-gray-700\">\r\n              {{options.ConfirmationBody}}\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n      <!--Style warning-->\r\n      <div *ngSwitchCase=\"styleWarning\" class=\"notice d-flex bg-light-warning rounded border-warning border border-dashed mb-10 p-6\">\r\n        <span class=\"svg-icon svg-icon-2tx svg-icon-warning me-4\">\r\n          <span [inlineSVG]=\"'./src/assets/images/gen044.svg'\"></span>\r\n        </span>\r\n\r\n        <div class=\"d-flex flex-stack flex-grow-1\">\r\n          <div class=\"fw-bold\">\r\n            <div class=\"fs-6 text-gray-700\">\r\n              {{options.ConfirmationBody}}\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n      <!--Style success-->\r\n      <div *ngSwitchCase=\"styleSuccess\" class=\"notice d-flex bg-light-success rounded border-success border border-dashed mb-10 p-6\">\r\n        <span class=\"svg-icon svg-icon-2tx svg-icon-success me-4\">\r\n          <span [inlineSVG]=\"'./src/assets/images/gen044.svg'\"></span>\r\n        </span>\r\n\r\n        <div class=\"d-flex flex-stack flex-grow-1\">\r\n          <div class=\"fw-bold\">\r\n            <div class=\"fs-6 text-gray-700\">\r\n              {{options.ConfirmationBody}}\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n    <div class=\"text-center pt-7\">\r\n      <button type=\"button\" class=\"btn btn-light btn-sm me-3 \" data-dismiss=\"modal\" (click)=\"modal.dismiss()\">\r\n        {{utilityService.getResourceValue(\"CancelLabel\")}}\r\n      </button>\r\n      <button type=\"button\" (click)=\"submit()\"\r\n              class=\"btn btn-light-danger btn-sm \">\r\n        {{options.SubmitButtonText}}\r\n      </button>\r\n\r\n    </div>\r\n  </div>\r\n</ng-template>\r\n",
-                    styles: [""]
+                    template: "",
+                    selector: 'BBSF-ConfirmationModal'
                 },] }
     ];
     ConfirmationModalComponent.ctorParameters = function () { return [
@@ -5559,6 +5602,7 @@
                         angularNgAutocomplete.AutocompleteLibModule,
                         bbsfUtilities.BBSFUtilitiesModule,
                         ngInlineSvg.InlineSVGModule.forRoot(),
+                        ngxSweetalert2.SweetAlert2Module
                     ],
                     providers: [
                         ErrorMassageValidation,