@bnsights/bbsf-controls 1.0.40 → 1.0.43

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (36) hide show
  1. package/README.md +13 -0
  2. package/bnsights-bbsf-controls-1.0.43.tgz +0 -0
  3. package/bnsights-bbsf-controls.metadata.json +1 -1
  4. package/bundles/bnsights-bbsf-controls.umd.js +109 -47
  5. package/bundles/bnsights-bbsf-controls.umd.js.map +1 -1
  6. package/esm2015/lib/Shared/Enums/Enums.js +2 -1
  7. package/esm2015/lib/Shared/Enums/FileType.js +2 -2
  8. package/esm2015/lib/Shared/Models/ControlOptionsBase.js +3 -1
  9. package/esm2015/lib/Shared/Models/FileDTO.js +1 -1
  10. package/esm2015/lib/Shared/Models/MultilingualTextBoxOptions.js +3 -1
  11. package/esm2015/lib/Shared/Models/MultipleFileUploadModel.js +1 -1
  12. package/esm2015/lib/Shared/Models/TagsInputOptions.js +1 -3
  13. package/esm2015/lib/Shared/Models/TextBoxOptions.js +3 -3
  14. package/esm2015/lib/Shared/Models/datePickerOptions.js +3 -1
  15. package/esm2015/lib/controls/DateTimePicker/DateTimePicker.component.js +2 -2
  16. package/esm2015/lib/controls/FileUplaod/FileUplaod.component.js +50 -33
  17. package/esm2015/lib/controls/Form/Form.component.js +13 -2
  18. package/esm2015/lib/controls/MultiLingualTextBox/MultiLingualTextBox.component.js +4 -4
  19. package/esm2015/lib/controls/Paging/Paging.component.js +29 -2
  20. package/esm2015/lib/controls/TagsInput/TagsInput.component.js +5 -1
  21. package/esm2015/lib/controls/TextBox/TextBox.component.js +2 -2
  22. package/esm2015/lib/controls/Toggleslide/toggleslide.component.js +2 -5
  23. package/fesm2015/bnsights-bbsf-controls.js +108 -47
  24. package/fesm2015/bnsights-bbsf-controls.js.map +1 -1
  25. package/lib/Shared/Enums/Enums.d.ts +2 -1
  26. package/lib/Shared/Enums/FileType.d.ts +1 -1
  27. package/lib/Shared/Models/FileDTO.d.ts +1 -1
  28. package/lib/Shared/Models/MultilingualTextBoxOptions.d.ts +2 -0
  29. package/lib/Shared/Models/MultipleFileUploadModel.d.ts +1 -1
  30. package/lib/Shared/Models/TagsInputOptions.d.ts +2 -0
  31. package/lib/Shared/Models/TextBoxOptions.d.ts +1 -1
  32. package/lib/controls/FileUplaod/FileUplaod.component.d.ts +4 -1
  33. package/lib/controls/Form/Form.component.d.ts +4 -1
  34. package/lib/controls/Paging/Paging.component.d.ts +3 -0
  35. package/package.json +2 -2
  36. package/bnsights-bbsf-controls-1.0.40.tgz +0 -0
@@ -564,7 +564,7 @@ DateInputComponent.controlContainerstatic = null;
564
564
  DateInputComponent.decorators = [
565
565
  { type: Component, args: [{
566
566
  selector: 'BBSF-DateTimePicker',
567
- template: "<div class=\"b-control b-date-picker\">\r\n <div class=\"form-group row validate is-invalid\" [formGroup]=\"group\">\r\n <label class=\"b-label col-form-label col-sm-12 \" [ngClass]=\"(options.ViewType==1)?'col-md-12':'col-md-3'\"\r\n [hidden]=\"options.HideLabel\">\r\n {{options.LabelValue}}\r\n <span *ngIf=\"(options.ShowAsterisk&&options.IsRequired)||(options.IsRequired)\" class=\"text-danger Required-text\"\r\n aria-required=\"true\">*</span>\r\n </label>\r\n\r\n <div class=\"col-sm-12\" [ngClass]=\"(options.ViewType==1)?'':'col-md-9'\">\r\n <div class=\"input-group\">\r\n <input autocomplete=\"off\" (dateTimeChange)=\"onDateSelect($event)\"\r\n dir=\"{{options.ForceDirection==2?'rtl':''}}\"\r\n class=\"form-control bnsights-control {{options.ExtraClasses}} \"\r\n [ngClass]=\"(options.ViewType==1)?'':'col-md-9'\" aria-describedby=\"email-error\" aria-invalid=\"true\"\r\n formControlName=\"{{options.Name}}\" [owlDateTime]=\"dt1\" [owlDateTimeTrigger]=\"dt1\"\r\n [class.is-invalid]=\"DatePickerFormControl.invalid && DatePickerFormControl.touched\"\r\n [min]=\"options.StartDate\" [max]=\"options.EndDate\" [selectMode]=\"getSelectMode(options.SelectMode)\"\r\n placeholder=\"{{options.Placeholder}}\" id=\"{{options.Name}}\" #Dateinput>\r\n\r\n <owl-date-time [pickerType]=\"getPickerType(options.PickerType)\"\r\n [startView]=\"getStartView(options.StartView)\" [firstDayOfWeek]=\"options.FirstDayOfWeek\"\r\n [hour12Timer]=\"options.Hour12Timer\" #dt1></owl-date-time>\r\n \r\n <div class=\"input-group-append\">\r\n <span class=\"input-group-text\" [owlDateTimeTrigger]=\"dt1\">\r\n <span class=\"svg-icon\">\r\n <svg id=\"Group_356\" data-name=\"Group 356\" xmlns=\"http://www.w3.org/2000/svg\" width=\"15\" height=\"15\" viewBox=\"0 0 48 48\">\r\n <path id=\"Path_6737\" data-name=\"Path 6737\" d=\"M11.583,1a1,1,0,0,0-2,0V5.7h2Z\" style=\"\"></path>\r\n <path id=\"Path_6738\" data-name=\"Path 6738\" d=\"M38.417,1a1,1,0,0,0-2,0V5.7h2Z\"></path>\r\n <path id=\"Path_6739\" data-name=\"Path 6739\" d=\"M0,43.146C0,45.822,1.826,48,4.07,48H43.928C46.174,48,48,45.822,48,43.146V17.121H0Z\" fill=\"#d5d5d5\"></path>\r\n <path id=\"Path_6740\" data-name=\"Path 6740\" d=\"M43.929,5.7H38.417v5.512a1,1,0,1,1-2,0V5.7H11.583v5.512a1,1,0,1,1-2,0V5.7H4.07C1.826,5.7,0,7.877,0,10.555v4.566H48V10.555C48,7.877,46.174,5.7,43.929,5.7Z\" fill=\"#595959\"></path>\r\n </svg>\r\n </span>\r\n </span>\r\n <!--<span class=\"input-group-text\" *ngIf=\"options.EnableCopyToClipboard\"\r\n (click)=\"copyInputMessage(Dateinput)\">\r\n <i class=\"fas fa-copy\"></i>\r\n </span>-->\r\n </div>\r\n </div>\r\n\r\n <div class=\"text-danger Required-text\"\r\n *ngIf=\"(DatePickerFormControl.invalid && DatePickerFormControl.touched)\">\r\n {{getErrorValidation(DatePickerFormControl.errors|keyvalue)}}\r\n </div>\r\n\r\n <div class=\"control-desc\"*ngIf=\"options.LabelDescription!=null\">{{options.LabelDescription}}</div>\r\n \r\n <div *ngIf=\"(group.valid&&group.dirty&&group.touched )||(group.untouched&&group.invalid&&group.dirty) \">{{resetError()}}</div>\r\n\r\n\r\n\r\n </div>\r\n\r\n </div>\r\n</div>\r\n",
567
+ template: "<div class=\"b-control b-date-picker\">\r\n <div class=\"form-group row validate is-invalid\" [formGroup]=\"group\">\r\n <label class=\"b-label col-form-label col-sm-12 \" [ngClass]=\"(options.ViewType==1)?'col-md-12':'col-md-3'\"\r\n [hidden]=\"options.HideLabel\">\r\n {{options.LabelValue}}\r\n <span *ngIf=\"(options.ShowAsterisk&&options.IsRequired)||(options.IsRequired)\" class=\"text-danger Required-text\"\r\n aria-required=\"true\">*</span>\r\n </label>\r\n\r\n <div class=\"col-sm-12\" [ngClass]=\"(options.ViewType==1)?'':'col-md-9'\">\r\n <div class=\"input-group\">\r\n <input autocomplete=\"off\" (dateTimeChange)=\"onDateSelect($event)\"\r\n dir=\"{{options.ForceDirection==2?'rtl':''}}\"\r\n class=\"form-control bnsights-control {{options.ExtraClasses}} \"\r\n [ngClass]=\"(options.ViewType==1)?'':'col-md-9'\" aria-describedby=\"email-error\" aria-invalid=\"true\"\r\n formControlName=\"{{options.Name}}\" [owlDateTime]=\"dt1\" [owlDateTimeTrigger]=\"dt1\"\r\n [class.is-invalid]=\"DatePickerFormControl.invalid && DatePickerFormControl.touched\"\r\n [min]=\"options.StartDate\" [max]=\"options.EndDate\" [hour12Timer]=\"options.Hour12Timer\" [selectMode]=\"getSelectMode(options.SelectMode)\"\r\n placeholder=\"{{options.Placeholder}}\" id=\"{{options.Name}}\" #Dateinput>\r\n\r\n <owl-date-time [pickerType]=\"getPickerType(options.PickerType)\"\r\n [startView]=\"getStartView(options.StartView)\" [firstDayOfWeek]=\"options.FirstDayOfWeek\"\r\n [hour12Timer]=\"options.Hour12Timer\" #dt1></owl-date-time>\r\n \r\n <div class=\"input-group-append\">\r\n <span class=\"input-group-text\" [owlDateTimeTrigger]=\"dt1\">\r\n <span class=\"svg-icon\">\r\n <svg id=\"Group_356\" data-name=\"Group 356\" xmlns=\"http://www.w3.org/2000/svg\" width=\"15\" height=\"15\" viewBox=\"0 0 48 48\">\r\n <path id=\"Path_6737\" data-name=\"Path 6737\" d=\"M11.583,1a1,1,0,0,0-2,0V5.7h2Z\" style=\"\"></path>\r\n <path id=\"Path_6738\" data-name=\"Path 6738\" d=\"M38.417,1a1,1,0,0,0-2,0V5.7h2Z\"></path>\r\n <path id=\"Path_6739\" data-name=\"Path 6739\" d=\"M0,43.146C0,45.822,1.826,48,4.07,48H43.928C46.174,48,48,45.822,48,43.146V17.121H0Z\" fill=\"#d5d5d5\"></path>\r\n <path id=\"Path_6740\" data-name=\"Path 6740\" d=\"M43.929,5.7H38.417v5.512a1,1,0,1,1-2,0V5.7H11.583v5.512a1,1,0,1,1-2,0V5.7H4.07C1.826,5.7,0,7.877,0,10.555v4.566H48V10.555C48,7.877,46.174,5.7,43.929,5.7Z\" fill=\"#595959\"></path>\r\n </svg>\r\n </span>\r\n </span>\r\n <!--<span class=\"input-group-text\" *ngIf=\"options.EnableCopyToClipboard\"\r\n (click)=\"copyInputMessage(Dateinput)\">\r\n <i class=\"fas fa-copy\"></i>\r\n </span>-->\r\n </div>\r\n </div>\r\n\r\n <div class=\"text-danger Required-text\"\r\n *ngIf=\"(DatePickerFormControl.invalid && DatePickerFormControl.touched)\">\r\n {{getErrorValidation(DatePickerFormControl.errors|keyvalue)}}\r\n </div>\r\n\r\n <div class=\"control-desc\"*ngIf=\"options.LabelDescription!=null\">{{options.LabelDescription}}</div>\r\n \r\n <div *ngIf=\"(group.valid&&group.dirty&&group.touched )||(group.untouched&&group.invalid&&group.dirty) \">{{resetError()}}</div>\r\n\r\n\r\n\r\n </div>\r\n\r\n </div>\r\n</div>\r\n",
568
568
  styles: [".example-form{min-width:150px;max-width:500px;width:100%}.example-full-width{width:100%}\n"]
569
569
  },] }
570
570
  ];
@@ -655,6 +655,7 @@ class FileUploadComponent {
655
655
  this.markAllAsTouched = false;
656
656
  this.validationRules = [];
657
657
  this.validationRulesasync = [];
658
+ this.deletedFiles = [];
658
659
  this.resetError = () => {
659
660
  this.controlValidationService.RemoveGlobalError();
660
661
  };
@@ -700,33 +701,43 @@ class FileUploadComponent {
700
701
  else {
701
702
  if (this.options.IsMultipleFile == true) {
702
703
  let files = [];
703
- this.multipleFileUploadModel = this.options.Value;
704
+ this.multipleFileUploadModel.ExistingFiles = this.options.Value.ExistingFiles;
705
+ this.multipleFileUploadModel.UploadedFiles = [];
704
706
  for (let index = 0; index < this.options.Value.ExistingFiles.length; index++) {
705
707
  const element = this.options.Value.ExistingFiles[index];
706
- // this.FileLikeObject = new FileLikeObject({
707
- // name: element.FileName,
708
- // size: element.FileSizeInMB * 1000 * 1000,
709
- // type: element.FileType,
710
- // rawFile: element.FileBase64,
711
- // })
712
- let blob;
713
- blob = new Blob(['']);
714
- blob.name = element.FileName;
715
- blob.lastModifiedDate = null;
716
- blob.webkitRelativePath = '';
717
- files.push(blob);
708
+ var bytes = new Uint8Array(element.Bytes);
709
+ var base64 = btoa(String.fromCharCode(null, bytes));
710
+ this.FileLikeObject = new FileLikeObject({
711
+ name: element.NameWithExtension,
712
+ type: element.MimeType,
713
+ rawFile: base64,
714
+ });
715
+ // let blob: any;
716
+ // blob = new Blob(['']) as any;
717
+ // blob.name = element.FileName;
718
+ // blob.lastModifiedDate = null;
719
+ // blob.webkitRelativePath = '';
720
+ let file = this.FileLikeObject;
721
+ file.url = element.FileURL;
722
+ files.push(file);
718
723
  }
719
724
  this.uploader.addToQueue(files);
725
+ console.log(this.uploader.queue);
720
726
  }
721
727
  else {
722
- const element = this.options.Value.File;
728
+ const element = this.options.Value;
729
+ var bytes = new Uint8Array(element.Bytes);
730
+ var base64 = btoa(String.fromCharCode(null, bytes));
723
731
  this.FileLikeObject = new FileLikeObject({
724
- name: element.FileName,
725
- size: element.FileSizeInMB * 1000 * 1000,
726
- type: element.FileType,
727
- rawFile: element.FileBase64,
732
+ name: element.NameWithExtension,
733
+ type: element.MimeType,
734
+ rawFile: base64,
728
735
  });
729
- this.uploader.addToQueue([this.FileLikeObject]);
736
+ this.file = element;
737
+ let file = this.FileLikeObject;
738
+ file.url = element.FileURL;
739
+ this.uploader.addToQueue([file]);
740
+ console.log(this.uploader.queue);
730
741
  }
731
742
  }
732
743
  if (this.options.LabelKey != null && this.options.LabelKey != "")
@@ -853,12 +864,16 @@ class FileUploadComponent {
853
864
  let fileObject = file.rawFile;
854
865
  reader.readAsDataURL(fileObject);
855
866
  reader.onload = () => {
867
+ let existingID_GUID = null;
868
+ if (!this.options.IsMultipleFile && this.file)
869
+ existingID_GUID = this.file.NameWithExtension == file.name ? this.file.ID_GUID : null;
856
870
  let AddedFile = {
857
871
  FileName: file.name,
858
872
  FileType: file.type,
859
873
  FileBase64: reader.result.toString().split(',')[1],
860
874
  FileSizeInMB: ((file.size / 1000) / 1000),
861
- NameWithExtension: file.name
875
+ NameWithExtension: file.name,
876
+ ID_GUID: existingID_GUID
862
877
  };
863
878
  if (this.options.IsMultipleFile == false) {
864
879
  this.fileUploadModel = new FileUploadModel();
@@ -898,33 +913,35 @@ class FileUploadComponent {
898
913
  else {
899
914
  if (this.options.Value != null && this.options.Value != undefined) {
900
915
  if (this.options.Value.CorrelationID_GUID == null) {
916
+ this.deletedFiles = [];
901
917
  this.multipleFileUploadModel.RemovedFiles = [];
902
918
  }
903
919
  else {
904
920
  if (this.multipleFileUploadModel.RemovedFiles.length == 0) {
905
921
  let FileObject = item.file.rawFile;
906
- let DeletedItemId = this.options.Value.ExistingFiles.filter(Object => Object.FileName == FileObject.name)[0];
907
- this.options.Value.ExistingFiles = this.options.Value.ExistingFiles.filter(Object => Object.FileName != FileObject.name);
908
- this.multipleFileUploadModel.RemovedFiles.push(DeletedItemId);
922
+ let DeletedItem = this.multipleFileUploadModel.ExistingFiles.filter(Object => Object.NameWithExtension == FileObject.name)[0];
923
+ this.multipleFileUploadModel.ExistingFiles = this.multipleFileUploadModel.ExistingFiles.filter(Object => Object.NameWithExtension != FileObject.name);
924
+ this.deletedFiles.push(DeletedItem);
925
+ this.multipleFileUploadModel.RemovedFiles.push(DeletedItem.ID_GUID);
909
926
  }
910
927
  else {
911
928
  let FileObject = item.file.rawFile;
912
- let deletedList = this.multipleFileUploadModel.RemovedFiles.filter(Object => Object.FileName == FileObject.name);
929
+ let deletedList = this.deletedFiles.filter(Object => Object.NameWithExtension == FileObject.name);
913
930
  if (deletedList.length == 0 || deletedList == undefined) {
914
- let DeletedItemId = this.options.Value.ExistingFiles.filter(Object => Object.FileName == FileObject.name)[0];
915
- this.options.Value.ExistingFiles = this.options.Value.ExistingFiles.filter(Object => Object.FileName != FileObject.name);
916
- this.multipleFileUploadModel.RemovedFiles.push(DeletedItemId);
931
+ let DeletedItem = this.multipleFileUploadModel.ExistingFiles.filter(Object => Object.NameWithExtension == FileObject.name)[0];
932
+ this.multipleFileUploadModel.ExistingFiles = this.multipleFileUploadModel.ExistingFiles.filter(Object => Object.NameWithExtension != FileObject.name);
933
+ this.deletedFiles.push(DeletedItem);
934
+ this.multipleFileUploadModel.RemovedFiles.push(DeletedItem.ID_GUID);
917
935
  }
918
936
  }
919
937
  }
920
938
  }
921
939
  else {
940
+ this.deletedFiles = [];
922
941
  this.multipleFileUploadModel.RemovedFiles = [];
923
942
  }
924
- let ItemList = this.group.get(this.options.Name).value.UploadedFiles;
925
- ItemList = ItemList.filter(Object => Object.FileName != item._file.name);
926
- this.multipleFileUploadModel.UploadedFiles = ItemList;
927
- if ((ItemList == null || ItemList == []) && this.options.IsRequired) {
943
+ this.multipleFileUploadModel.UploadedFiles = this.multipleFileUploadModel.UploadedFiles.filter(Object => Object.NameWithExtension != item._file.name);
944
+ if ((this.multipleFileUploadModel.UploadedFiles == null || this.multipleFileUploadModel.UploadedFiles == []) && this.options.IsRequired) {
928
945
  this.fileUploadFormControl.markAsTouched();
929
946
  this.fileUploadFormControl.invalid;
930
947
  }
@@ -937,7 +954,7 @@ FileUploadComponent.controlContainerstatic = null;
937
954
  FileUploadComponent.decorators = [
938
955
  { type: Component, args: [{
939
956
  selector: 'BBSF-FileUplaod',
940
- template: "\r\n<div class=\"b-control b-fileupload\">\r\n <div class=\"form-group row validate is-invalid\" [formGroup]=\"group\">\r\n <label class=\"col-form-label col-sm-12 mb-2\" [ngClass]=\"(options.ViewType==1)?'col-md-12':'col-md-3'\"\r\n [hidden]=\"options.HideLabel\">\r\n {{options.LabelValue}}\r\n <span *ngIf=\"(options.ShowAsterisk&&options.IsRequired)||(options.IsRequired)\" class=\"text-danger Required-text\"\r\n aria-required=\"true\">*</span>\r\n \r\n <ejs-tooltip id=\"tooltip\" content='{{ValidationMessage}}' tipPointerPosition='Middle'\r\n *ngIf=\"(ValidationMessage!=null&&ValidationMessage!='')\">\r\n <i class=\"fa fa-info-circle\" data-plugin=\"tooltip\" data-html=\"true\">\r\n </i>\r\n </ejs-tooltip>\r\n \r\n \r\n </label>\r\n \r\n <div class=\"col-sm-12\" [ngClass]=\"(options.ViewType==1)?'':'col-md-9'\">\r\n \r\n <div>\r\n \r\n <div ng2FileDrop *ngIf=\"(options.IsDropZone)&&(!((options.IsMultipleFile==false)&&(uploader.queue.length)>0))\" \r\n [ngClass]=\"{'another-file-over-class': hasAnotherDropZoneOver}\" (onFileDrop)=\"onFileChange()\"\r\n (fileOver)=\"fileOverAnother($event)\" [uploader]=\"uploader\" [accept]=\"AcceptedType\"\r\n class=\"well my-drop-zoneform-control bnsights-control {{options.ExtraClasses}}\"\r\n (change)=\"onFileChange()\" id=\"{{options.Name}}\" multiple=\"{{options.IsMultipleFile?'multiple':''}}\"\r\n aria-describedby=\"email-error\" aria-invalid=\"true\" type=\"file\" formControlName=\"{{options.Name}}\"\r\n id=\"options.Name\" #fileInput\r\n [class.is-invalid]=\"fileUploadFormControl.invalid && fileUploadFormControl.touched\">\r\n \r\n \r\n <div class=\"dragndrop text-center\">\r\n <p class=\"drag-icon mb-3\">\r\n <i class=\"fas fa-cloud-download-alt\"></i> \r\n </p>\r\n <p>Drag and Drop File Here </p>\r\n </div>\r\n </div>\r\n \r\n <div *ngIf=\"(!options.IsDropZone)&&!((uploader.queue.length>0)&&(!options.IsMultipleFile))\">\r\n <button type=\"button\" class=\"btn btn-light btn-sm file-fake-input mb-3\" (click)=\"fileInput.click();\">\r\n <i class=\"icon fa fa-cloud-upload-alt\" ></i>\r\n Upload\r\n </button>\r\n <input ng2FileSelect [uploader]=\"uploader\" [accept]=\"AcceptedType\"\r\n class=\"fileSelector customFileUploadPlacment hidden v-required-multiplefiles d-none\" id=\"file\"\r\n multiple=\"{{options.IsMultipleFile?'multiple':''}}\" name=\"file\" type=\"file\" value=\"\"\r\n autocomplete=\"off\" (change)=\"onFileChange()\" [ngClass]=\"(options.ViewType==1)?'':'col-md-9'\"\r\n id=\"{{options.Name}}\" aria-describedby=\"email-error\" aria-invalid=\"true\" type=\"file\"\r\n formControlName=\"{{options.Name}}\" id=\"options.Name\" #fileInput\r\n [class.is-invalid]=\"fileUploadFormControl.invalid && fileUploadFormControl.touched\">\r\n </div>\r\n \r\n </div>\r\n \r\n <div *ngFor=\"let item of uploader.queue\">\r\n <div class=\"fileInfoContainer ui-file btn-group mb-3\" >\r\n <button type=\"button\"class=\"download-link btn btn-light btn-sm\">\r\n <span>\r\n <i class=\"icon fa fa-download\"></i>\r\n <span class=\"upload-file-info\">{{ item?.file?.name }}</span>\r\n </span>\r\n </button>\r\n <span class=\"removeUIFile remove-link btn btn-xs btn-danger d-flex align-items-center justify-content-center\"\r\n (click)=\"item.remove();removeFromControlValue(item)\">\r\n <i class=\"fa fa-times px-0\"></i>\r\n </span>\r\n </div>\r\n </div>\r\n \r\n \r\n <div class=\"text-danger Required-text\" *ngIf=\"(fileUploadFormControl.invalid && fileUploadFormControl.touched)\">\r\n {{getErrorValidation(fileUploadFormControl.errors|keyvalue)}}\r\n </div>\r\n \r\n \r\n \r\n <div class=\"col-md-9 col-sm-9\">\r\n \r\n <div><label>{{options.LabelDescription}}\r\n </label></div>\r\n \r\n \r\n </div>\r\n <div *ngIf=\"(group.valid&&group.dirty&&group.touched )||(group.untouched&&group.invalid&&group.dirty) \">{{resetError()}}</div>\r\n \r\n \r\n \r\n </div>\r\n \r\n </div>\r\n</div>\r\n",
957
+ template: "\r\n<div class=\"b-control b-fileupload\">\r\n <div class=\"form-group row validate is-invalid\" [formGroup]=\"group\">\r\n <label class=\"col-form-label col-sm-12 mb-2\" [ngClass]=\"(options.ViewType==1)?'col-md-12':'col-md-3'\"\r\n [hidden]=\"options.HideLabel\">\r\n {{options.LabelValue}}\r\n <span *ngIf=\"(options.ShowAsterisk&&options.IsRequired)||(options.IsRequired)\" class=\"text-danger Required-text\"\r\n aria-required=\"true\">*</span>\r\n\r\n <ejs-tooltip id=\"tooltip\" content='{{ValidationMessage}}' tipPointerPosition='Middle'\r\n *ngIf=\"(ValidationMessage!=null&&ValidationMessage!='')\">\r\n <i class=\"fa fa-info-circle\" data-plugin=\"tooltip\" data-html=\"true\">\r\n </i>\r\n </ejs-tooltip>\r\n\r\n\r\n </label>\r\n\r\n <div class=\"col-sm-12\" [ngClass]=\"(options.ViewType==1)?'':'col-md-9'\">\r\n\r\n <div>\r\n\r\n <div ng2FileDrop *ngIf=\"(options.IsDropZone)&&(!((options.IsMultipleFile==false)&&(uploader.queue.length)>0))\"\r\n [ngClass]=\"{'another-file-over-class': hasAnotherDropZoneOver}\" (onFileDrop)=\"onFileChange()\"\r\n (fileOver)=\"fileOverAnother($event)\" [uploader]=\"uploader\" [accept]=\"AcceptedType\"\r\n class=\"well my-drop-zoneform-control bnsights-control {{options.ExtraClasses}}\"\r\n (change)=\"onFileChange()\" id=\"{{options.Name}}\" multiple=\"{{options.IsMultipleFile?'multiple':''}}\"\r\n aria-describedby=\"email-error\" aria-invalid=\"true\" type=\"file\" formControlName=\"{{options.Name}}\"\r\n id=\"options.Name\" #fileInput\r\n [class.is-invalid]=\"fileUploadFormControl.invalid && fileUploadFormControl.touched\">\r\n\r\n\r\n <div class=\"dragndrop text-center\">\r\n <p class=\"drag-icon mb-3\">\r\n <i class=\"fas fa-cloud-download-alt\"></i>\r\n </p>\r\n <p>\r\n {{UtilityService.getResourceValue(\"DragAndDropHere\")}}\r\n </p>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"(!options.IsDropZone)&&!((uploader.queue.length>0)&&(!options.IsMultipleFile))\">\r\n <button type=\"button\" class=\"btn btn-light btn-sm file-fake-input mb-3\" (click)=\"fileInput.click();\">\r\n <i class=\"icon fa fa-cloud-upload-alt\"></i>\r\n {{UtilityService.getResourceValue(\"Upload\")}}\r\n </button>\r\n <input ng2FileSelect [uploader]=\"uploader\" [accept]=\"AcceptedType\"\r\n class=\"fileSelector customFileUploadPlacment hidden v-required-multiplefiles d-none\" id=\"file\"\r\n multiple=\"{{options.IsMultipleFile?'multiple':''}}\" name=\"file\" type=\"file\" value=\"\"\r\n autocomplete=\"off\" (change)=\"onFileChange()\" [ngClass]=\"(options.ViewType==1)?'':'col-md-9'\"\r\n id=\"{{options.Name}}\" aria-describedby=\"email-error\" aria-invalid=\"true\" type=\"file\"\r\n formControlName=\"{{options.Name}}\" id=\"options.Name\" #fileInput\r\n [class.is-invalid]=\"fileUploadFormControl.invalid && fileUploadFormControl.touched\">\r\n </div>\r\n\r\n </div>\r\n\r\n <div *ngFor=\"let item of uploader.queue\">\r\n <div class=\"fileInfoContainer ui-file btn-group mb-3\">\r\n <a href=\"{{ item?._file?.url}}\" download>\r\n <button type=\"button\" class=\"download-link btn btn-light btn-sm\">\r\n <span>\r\n <i class=\"icon fa fa-download\"></i>\r\n <span class=\"upload-file-info\">{{ item?.file?.name }}</span>\r\n </span>\r\n </button>\r\n </a>\r\n <span class=\"removeUIFile remove-link btn btn-xs btn-danger d-flex align-items-center justify-content-center\"\r\n (click)=\"item.remove();removeFromControlValue(item)\">\r\n <i class=\"fa fa-times px-0\"></i>\r\n </span>\r\n </div>\r\n </div>\r\n\r\n\r\n <div class=\"text-danger Required-text\" *ngIf=\"(fileUploadFormControl.invalid && fileUploadFormControl.touched)\">\r\n {{getErrorValidation(fileUploadFormControl.errors|keyvalue)}}\r\n </div>\r\n\r\n\r\n\r\n <div class=\"col-md-9 col-sm-9\">\r\n\r\n <div>\r\n <label>\r\n {{options.LabelDescription}}\r\n </label>\r\n </div>\r\n\r\n\r\n </div>\r\n <div *ngIf=\"(group.valid&&group.dirty&&group.touched )||(group.untouched&&group.invalid&&group.dirty) \">{{resetError()}}</div>\r\n\r\n\r\n\r\n </div>\r\n\r\n </div>\r\n</div>\r\n",
941
958
  styles: [".e-tip-content{background-color:#afafaf;color:#fff;padding-left:10px;padding-right:10px;padding-top:2px}.my-drop-zone{border:dotted 3px lightgray}.nv-file-over{border:dotted 3px red}.another-file-over-class{border:dotted 3px green}html,body{height:100%}\n"]
942
959
  },] }
943
960
  ];
@@ -1028,7 +1045,7 @@ class MultiLingualTextBoxComponent {
1028
1045
  this.CurrentLanguage = translate.currentLang != undefined ? translate.currentLang : translate.defaultLang;
1029
1046
  }
1030
1047
  getCustomErrorsMassages() {
1031
- this.ArabicLetterOnly = this.UtilityService.getResourceValue("VAL_ArabicIsRequiredAndOnly50CharactersEnglish");
1048
+ this.ArabicLetterOnly = this.UtilityService.getResourceValue("ArabicIsRequiredAndOnly50CharactersEnglish");
1032
1049
  this.EnglishLetterOnly = this.UtilityService.getResourceValue("EnglishLetterOnly");
1033
1050
  }
1034
1051
  ngOnInit() {
@@ -1080,7 +1097,7 @@ class MultiLingualTextBoxComponent {
1080
1097
  }
1081
1098
  this.showInputUsingLanguageMode();
1082
1099
  this.ArabicValidationRules.push(Validators.compose([
1083
- this.controlUtility.arabicValidator({ ArabicLetterOnly: this.ArabicLetterOnly }),
1100
+ this.controlUtility.arabicValidator({ ArabicIsRequiredAndOnly50CharactersEnglish: this.ArabicLetterOnly }),
1084
1101
  ]));
1085
1102
  this.EnglishValidationRules.push(Validators.compose([
1086
1103
  this.controlUtility.patternValidator(/^[\x00-\x7F]*$/, { EnglishLetterOnly: this.EnglishLetterOnly }),
@@ -1340,7 +1357,7 @@ MultiLingualTextBoxComponent.controlContainerstatic = null;
1340
1357
  MultiLingualTextBoxComponent.decorators = [
1341
1358
  { type: Component, args: [{
1342
1359
  selector: 'BBSF-MultiLingualTextBox',
1343
- template: "<div class=\"b-control b-multilangual-textbox\">\r\n <div class=\"form-group validate is-invalid\" [formGroup]=\"group\">\r\n\r\n <div class=\"form-group row\" [formGroup]=\"MultiLanguagegroup\">\r\n <div [ngClass]=\"(options.MultiControlPlacementType==1)?'col-md-12':'col-md-6'\">\r\n <div class=\"row\" *ngIf=\"ShowEnglishTextBox\">\r\n <label class=\"b-label col-form-label col-sm-12\"\r\n [ngClass]=\"(options.ViewType==1)?'col-md-9':'col-md-3'\" [hidden]=\"options.IsHideEnglishLabel\">\r\n {{(options.EnglishLabelValue!=null&&options.EnglishLabelValue!=\"\")?options.EnglishLabelValue:options.LabelValue}}\r\n <span *ngIf=\"(options.ShowAsterisk&&options.IsRequired)||(options.IsRequired)\"\r\n class=\"text-danger Required-text\" aria-required=\"true\">*</span>\r\n </label>\r\n\r\n <div class=\"col-sm-12\" [ngClass]=\"(options.ViewType==1)?'':'col-md-9'\">\r\n <div class=\"input-group align-items-center\">\r\n <div class=\"svg svg-icon-grey\" [ngClass]=\"(options.IconPositionEN==1)?'left-icon':'right-icon'\" *ngIf=\"options.Icon!=null\">\r\n <span [inlineSVG]=\"options.Icon\"></span>\r\n </div>\r\n <input class=\"form-control bnsights-control\"\r\n (focus)=\"onEnglishFocus(true)\" (focusout)=\"onEnglishFocus(false)\"\r\n aria-describedby=\"email-error\" aria-invalid=\"true\" formControlName=\"English\"\r\n [hidden]=\"options.IsHideEnglishFields\" maxlength=\"{{options.MaxLength}}\" minlength=\"{{options.MinLength}}\"\r\n [class.is-invalid]=\"EnglishFormControl.invalid && EnglishFormControl.touched\"\r\n placeholder=\"{{options.EnglishPlaceholder}}\" (change)=\"trimControlValue('En')\"\r\n (keyup)=\"onTextChange()\"\r\n (keydown)=\"EnglishWordCountArray>options.MaxWordCount&&$event.keyCode !=8?$event.preventDefault():null\"\r\n #userinputEnglish>\r\n <div class=\"input-group-append\" [hidden]=\"options.IsHideEnglishFields\" *ngIf=\"options.EnableCopyToClipboard\">\r\n <span class=\"input-group-text\" (click)=\"copyInputMessage(userinputEnglish)\">\r\n <i class=\"fas fa-copy\"></i>\r\n </span>\r\n </div>\r\n </div>\r\n <div class=\"text-muted font-weight-500 word-count float-end\" *ngIf=\"options.MaxWordCount>0&&IsShowEnglishWordCount\">{{EnglishWordCount}}/{{options.MaxWordCount}}</div>\r\n <div class=\"text-danger Required-text\" *ngIf=\"(EnglishFormControl.invalid && EnglishFormControl.touched)\">\r\n {{getErrorValidation(EnglishFormControl.errors|keyvalue)}}\r\n </div>\r\n <div *ngIf=\"showEnglishCharsLimitMsg\">\r\n <span class=\"badge b-character-warning float-end\" [ngClass]=\"{'badge-light-warning': englishCharsLimitMsgClass === 'warning', 'badge-light-danger' : englishCharsLimitMsgClass === 'danger' }\">\r\n {{englishMaxLimitWarningMsg}}\r\n </span>\r\n </div>\r\n <div class=\"control-desc\" *ngIf=\"(options.LabelDescription!=null&&options.LabelDescription!='') ||(options.EnglishLabelDescription!=null&&options.EnglishLabelDescription!='')\">\r\n {{(options.EnglishLabelDescription!=null&&options.EnglishLabelDescription!=\"\")?options.EnglishLabelDescription:options.LabelDescription}}\r\n </div>\r\n <!-- <div *ngIf=\"EnglishFormControl.valid\">{{resetError()}}</div> -->\r\n <div *ngIf=\"group.valid\">{{resetError()}}</div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div [ngClass]=\"(options.MultiControlPlacementType==1)?'col-md-12':'col-md-6'\">\r\n <div class=\"row\" *ngIf=\"ShowArabicTextBox\">\r\n <label class=\"b-label col-form-label col-sm-12\"\r\n [ngClass]=\"(options.ViewType==1)?'col-md-12':'col-md-3'\" [hidden]=\"options.IsHideArabicLabel\">\r\n {{(options.ArabicLabelValue!=null&&options.ArabicLabelValue!=\"\")?options.ArabicLabelValue:options.LabelValue}}\r\n <span *ngIf=\"(options.ShowAsterisk&&options.IsRequired)||(options.IsRequired)\" class=\"text-danger Required-text\" aria-required=\"true\">*</span>\r\n </label>\r\n <div class=\" col-sm-12\" [ngClass]=\"(options.ViewType==1)?'':'col-md-9'\">\r\n <div class=\"input-group align-items-center\">\r\n <div class=\"svg svg-icon-grey\" [ngClass]=\"(options.IconPositionEN==1)?'right-icon':'left-icon'\" *ngIf=\"options.Icon!=null\">\r\n <span [inlineSVG]=\"options.Icon\"></span>\r\n </div>\r\n <input class=\"form-control bnsights-control\" dir=\"rtl\"\r\n (focus)=\"onArabicFocus(true)\" (focusout)=\"onArabicFocus(false)\"\r\n [hidden]=\"options.IsHideArabicFields\" aria-describedby=\"email-error\" aria-invalid=\"true\"\r\n formControlName=\"Arabic\" maxlength=\"{{options.MaxLength}}\" minlength=\"{{options.MinLength}}\"\r\n [class.is-invalid]=\"ArabicFormControl.invalid && ArabicFormControl.touched\"\r\n placeholder=\"{{options.ArabicPlaceholder}}\" (keyup)=\"onTextChange()\"\r\n (keydown)=\"ArabicWordCountArray>options.MaxWordCount&&$event.keyCode !=8?$event.preventDefault():null\"\r\n (change)=\"trimControlValue('Ar')\" #userinputArabic>\r\n\r\n <div class=\"input-group-append\" [hidden]=\"options.IsHideArabicFields\" *ngIf=\"options.EnableCopyToClipboard\">\r\n <span class=\"input-group-text\" (click)=\"copyInputMessage(userinputArabic)\">\r\n <i class=\"fas fa-copy\"></i>\r\n </span>\r\n </div>\r\n </div>\r\n <div class=\"text-muted font-weight-500 float-end word-count\" *ngIf=\"options.MaxWordCount>0&&IsShowArabicWordCount\">{{ArabicWordCount}}/{{options.MaxWordCount}}</div>\r\n <div class=\"text-danger Required-text\" *ngIf=\"(ArabicFormControl.invalid && ArabicFormControl.touched)\">\r\n {{getErrorValidation(ArabicFormControl.errors|keyvalue)}}\r\n </div>\r\n <div *ngIf=\"showArabicCharsLimitMsg\">\r\n <span class=\"badge b-character-warning float-end\" [ngClass]=\"{'badge-light-warning': arabicCharsLimitMsgClass === 'warning', 'badge-light-danger' : arabicCharsLimitMsgClass === 'danger' }\">\r\n {{arabicMaxLimitWarningMsg}}\r\n </span>\r\n </div>\r\n <div class=\"control-desc\" *ngIf=\"(options.LabelDescription!=null&&options.LabelDescription!='')||(options.ArabicLabelDescription!=null&&options.ArabicLabelDescription!='')\">\r\n {{(options.ArabicLabelDescription!=null&&options.ArabicLabelDescription!=\"\")?options.ArabicLabelDescription:options.LabelDescription}}\r\n </div>\r\n <!-- <div *ngIf=\"ArabicFormControl.valid\">{{resetError()}}</div> -->\r\n <div *ngIf=\"group.valid\">{{resetError()}}</div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n</div>\r\n",
1360
+ template: "<div class=\"b-control b-multilangual-textbox\">\r\n <div class=\"form-group validate is-invalid\" [formGroup]=\"group\">\r\n\r\n <div class=\"form-group row\" [formGroup]=\"MultiLanguagegroup\">\r\n <div [ngClass]=\"(options.MultiControlPlacementType==1)?'col-md-12':'col-md-6'\">\r\n <div class=\"row\" *ngIf=\"ShowEnglishTextBox\">\r\n <label class=\"b-label col-form-label col-sm-12\"\r\n [ngClass]=\"(options.ViewType==1)?'col-md-9':'col-md-3'\" [hidden]=\"options.IsHideEnglishLabel\">\r\n {{(options.EnglishLabelValue!=null&&options.EnglishLabelValue!=\"\")?options.EnglishLabelValue:options.LabelValue}}\r\n <span *ngIf=\"(options.ShowAsterisk&&options.IsRequired)||(options.IsRequired)\"\r\n class=\"text-danger Required-text\" aria-required=\"true\">*</span>\r\n </label>\r\n\r\n <div class=\"col-sm-12\" [ngClass]=\"(options.ViewType==1)?'':'col-md-9'\">\r\n <div class=\"input-group align-items-center\">\r\n <div class=\"svg svg-icon-grey\" [ngClass]=\"(options.IconPositionEN==1)?'left-icon':'right-icon'\" *ngIf=\"options.Icon!=null\">\r\n <span [inlineSVG]=\"options.Icon\"></span>\r\n </div>\r\n <input class=\"form-control bnsights-control\"\r\n (focus)=\"onEnglishFocus(true)\" (focusout)=\"onEnglishFocus(false)\"\r\n aria-describedby=\"email-error\" aria-invalid=\"true\" formControlName=\"English\"\r\n [hidden]=\"options.IsHideEnglishFields\" maxlength=\"{{options.MaxLength}}\" minlength=\"{{options.MinLength}}\"\r\n [class.is-invalid]=\"EnglishFormControl.invalid && EnglishFormControl.touched\"\r\n placeholder=\"{{options.EnglishPlaceholder}}\" (change)=\"trimControlValue('En')\"\r\n (keyup)=\"onTextChange()\"\r\n (keydown)=\"EnglishWordCountArray>options.MaxWordCount&&$event.keyCode !=8?$event.preventDefault():null\"\r\n autocomplete=\"{{options.AutoComplete}}\"\r\n id=\"{{options.Name}}.English\"\r\n #userinputEnglish>\r\n <div class=\"input-group-append\" [hidden]=\"options.IsHideEnglishFields\" *ngIf=\"options.EnableCopyToClipboard\">\r\n <span class=\"input-group-text\" (click)=\"copyInputMessage(userinputEnglish)\">\r\n <i class=\"fas fa-copy\"></i>\r\n </span>\r\n </div>\r\n </div>\r\n <div class=\"text-muted font-weight-500 word-count float-end\" *ngIf=\"options.MaxWordCount>0&&IsShowEnglishWordCount\">{{EnglishWordCount}}/{{options.MaxWordCount}}</div>\r\n <div class=\"text-danger Required-text\" *ngIf=\"(EnglishFormControl.invalid && EnglishFormControl.touched)\">\r\n {{getErrorValidation(EnglishFormControl.errors|keyvalue)}}\r\n </div>\r\n <div *ngIf=\"showEnglishCharsLimitMsg\">\r\n <span class=\"badge b-character-warning float-end\" [ngClass]=\"{'badge-light-warning': englishCharsLimitMsgClass === 'warning', 'badge-light-danger' : englishCharsLimitMsgClass === 'danger' }\">\r\n {{englishMaxLimitWarningMsg}}\r\n </span>\r\n </div>\r\n <div class=\"control-desc\" *ngIf=\"(options.LabelDescription!=null&&options.LabelDescription!='') ||(options.EnglishLabelDescription!=null&&options.EnglishLabelDescription!='')\">\r\n {{(options.EnglishLabelDescription!=null&&options.EnglishLabelDescription!=\"\")?options.EnglishLabelDescription:options.LabelDescription}}\r\n </div>\r\n <!-- <div *ngIf=\"EnglishFormControl.valid\">{{resetError()}}</div> -->\r\n <div *ngIf=\"group.valid\">{{resetError()}}</div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div [ngClass]=\"(options.MultiControlPlacementType==1)?'col-md-12':'col-md-6'\">\r\n <div class=\"row\" *ngIf=\"ShowArabicTextBox\">\r\n <label class=\"b-label col-form-label col-sm-12\"\r\n [ngClass]=\"(options.ViewType==1)?'col-md-12':'col-md-3'\" [hidden]=\"options.IsHideArabicLabel\">\r\n {{(options.ArabicLabelValue!=null&&options.ArabicLabelValue!=\"\")?options.ArabicLabelValue:options.LabelValue}}\r\n <span *ngIf=\"(options.ShowAsterisk&&options.IsRequired)||(options.IsRequired)\" class=\"text-danger Required-text\" aria-required=\"true\">*</span>\r\n </label>\r\n <div class=\" col-sm-12\" [ngClass]=\"(options.ViewType==1)?'':'col-md-9'\">\r\n <div class=\"input-group align-items-center\">\r\n <div class=\"svg svg-icon-grey\" [ngClass]=\"(options.IconPositionEN==1)?'right-icon':'left-icon'\" *ngIf=\"options.Icon!=null\">\r\n <span [inlineSVG]=\"options.Icon\"></span>\r\n </div>\r\n <input class=\"form-control bnsights-control\" dir=\"rtl\"\r\n (focus)=\"onArabicFocus(true)\" (focusout)=\"onArabicFocus(false)\"\r\n [hidden]=\"options.IsHideArabicFields\" aria-describedby=\"email-error\" aria-invalid=\"true\"\r\n formControlName=\"Arabic\" maxlength=\"{{options.MaxLength}}\" minlength=\"{{options.MinLength}}\"\r\n [class.is-invalid]=\"ArabicFormControl.invalid && ArabicFormControl.touched\"\r\n placeholder=\"{{options.ArabicPlaceholder}}\" (keyup)=\"onTextChange()\"\r\n (keydown)=\"ArabicWordCountArray>options.MaxWordCount&&$event.keyCode !=8?$event.preventDefault():null\"\r\n autocomplete=\"{{options.AutoComplete}}\"\r\n id=\"{{options.Name}}.Arabic\"\r\n (change)=\"trimControlValue('Ar')\" #userinputArabic>\r\n\r\n <div class=\"input-group-append\" [hidden]=\"options.IsHideArabicFields\" *ngIf=\"options.EnableCopyToClipboard\">\r\n <span class=\"input-group-text\" (click)=\"copyInputMessage(userinputArabic)\">\r\n <i class=\"fas fa-copy\"></i>\r\n </span>\r\n </div>\r\n </div>\r\n <div class=\"text-muted font-weight-500 float-end word-count\" *ngIf=\"options.MaxWordCount>0&&IsShowArabicWordCount\">{{ArabicWordCount}}/{{options.MaxWordCount}}</div>\r\n <div class=\"text-danger Required-text\" *ngIf=\"(ArabicFormControl.invalid && ArabicFormControl.touched)\">\r\n {{getErrorValidation(ArabicFormControl.errors|keyvalue)}}\r\n </div>\r\n <div *ngIf=\"showArabicCharsLimitMsg\">\r\n <span class=\"badge b-character-warning float-end\" [ngClass]=\"{'badge-light-warning': arabicCharsLimitMsgClass === 'warning', 'badge-light-danger' : arabicCharsLimitMsgClass === 'danger' }\">\r\n {{arabicMaxLimitWarningMsg}}\r\n </span>\r\n </div>\r\n <div class=\"control-desc\" *ngIf=\"(options.LabelDescription!=null&&options.LabelDescription!='')||(options.ArabicLabelDescription!=null&&options.ArabicLabelDescription!='')\">\r\n {{(options.ArabicLabelDescription!=null&&options.ArabicLabelDescription!=\"\")?options.ArabicLabelDescription:options.LabelDescription}}\r\n </div>\r\n <!-- <div *ngIf=\"ArabicFormControl.valid\">{{resetError()}}</div> -->\r\n <div *ngIf=\"group.valid\">{{resetError()}}</div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n</div>\r\n",
1344
1361
  styles: [".example-form{min-width:150px;max-width:500px;width:100%}.example-full-width{width:100%}\n"]
1345
1362
  },] }
1346
1363
  ];
@@ -2366,9 +2383,6 @@ class ToggleslideComponent {
2366
2383
  this.SlideValue = this.options.Value == undefined ? false : this.options.Value;
2367
2384
  if (!this.options.ViewType)
2368
2385
  this.options.ViewType = this.globalSettings.ViewType;
2369
- if (this.options.IsDisabled) {
2370
- this.ToggleslideFormControl.disable();
2371
- }
2372
2386
  if (this.options.LabelKey != null && this.options.LabelKey != "")
2373
2387
  this.options.LabelValue = this.UtilityService.getResourceValue(this.options.LabelKey);
2374
2388
  }
@@ -2405,7 +2419,7 @@ ToggleslideComponent.controlContainerstatic = null;
2405
2419
  ToggleslideComponent.decorators = [
2406
2420
  { type: Component, args: [{
2407
2421
  selector: 'BBSF-Toggleslide',
2408
- template: "<div class=\"b-control b-toggle-slide\">\r\n <div class=\"form-group validate is-invalid\" [formGroup]=\"group\">\r\n <label class=\"b-label col-form-label col-sm-12 \" [ngClass]=\"(options.ViewType==1)?'col-md-12':'col-md-3'\"\r\n [hidden]=\"options.HideLabel\">\r\n {{options.LabelValue}}\r\n </label>\r\n <mat-slide-toggle [(ngModel)]=\"SlideValue\" dir=\"{{options.ForceDirection==2?'rtl':''}}\" [cssClass]=\"(options.ViewType==1)?'':'col-md-9'\"\r\n formControlName=\"{{options.Name}}\" disableRipple=\"true\"\r\n (change)=\"changeValueToggle()\">\r\n </mat-slide-toggle>\r\n \r\n </div>\r\n</div>\r\n",
2422
+ template: "<div class=\"b-control b-toggle-slide\">\r\n <div class=\"form-group validate is-invalid\" [formGroup]=\"group\">\r\n <label class=\"b-label col-form-label col-sm-12 \" [ngClass]=\"(options.ViewType==1)?'col-md-12':'col-md-3'\"\r\n [hidden]=\"options.HideLabel\">\r\n {{options.LabelValue}}\r\n </label>\r\n <mat-slide-toggle [(ngModel)]=\"SlideValue\" dir=\"{{options.ForceDirection==2?'rtl':''}}\" [cssClass]=\"(options.ViewType==1)?'':'col-md-9'\"\r\n formControlName=\"{{options.Name}}\" disableRipple=\"true\" disabled=\"{{options.IsDisabled}}\" (change)=\"changeValueToggle()\">\r\n </mat-slide-toggle>\r\n \r\n </div>\r\n</div>\r\n",
2409
2423
  styles: [".mat-slide-toggle{padding-left:10px}.mat-slide-toggle.mat-checked .mat-slide-toggle-bar{background-color:#e3f4fe}.mat-slide-toggle-thumb-container{width:25px;height:25px;top:1px;left:-2px}.mat-slide-toggle.mat-checked .mat-slide-toggle-thumb{background-color:#009ef7}.mat-slide-toggle-thumb{height:25px;width:25px;border-radius:50%}.mat-slide-toggle.mat-checked .mat-ripple-element{background-color:#009ef7}.mat-slide-toggle-bar{width:55px;height:30px;border-radius:3.25rem}\n"]
2410
2424
  },] }
2411
2425
  ];
@@ -3996,6 +4010,8 @@ class TagsInputComponent {
3996
4010
  this.options.ViewType = this.globalSettings.ViewType;
3997
4011
  if (this.options.LabelKey != null && this.options.LabelKey != "")
3998
4012
  this.options.LabelValue = this.UtilityService.getResourceValue(this.options.LabelKey);
4013
+ if (!this.options.NoResultText)
4014
+ this.options.NoResultText = this.UtilityService.getResourceValue("NoItemsMatch");
3999
4015
  // this.group.addControl(this.options.Name, new FormControl(''));
4000
4016
  // this.TagInputControl = this.group.controls[this.options.Name]; // new FormControl('',validationRules);
4001
4017
  this.TagsFormControl.setValue(this.options.Value);
@@ -4052,6 +4068,8 @@ class TagsInputComponent {
4052
4068
  }
4053
4069
  searchFunctionFactory(Text) {
4054
4070
  let Url = `${this.options.ActionURL}?${this.options.QueryParamName}=${Text}&${this.options.SelectedItemsParamName}=${this.SelectedId}`;
4071
+ if (this.options.ExtraFilters)
4072
+ Url = Url + `&${this.options.ExtraFilters}`;
4055
4073
  let requestOptionsModel = new RequestOptionsModel();
4056
4074
  requestOptionsModel.disableBlockUI = true;
4057
4075
  requestOptionsModel.disableSuccessNotification = true;
@@ -4337,6 +4355,7 @@ class PagingComponent {
4337
4355
  this.items = [];
4338
4356
  this.Pages = Math.ceil((this.totalRow / this.options.PageSize));
4339
4357
  this.items = Array(this.totalRow);
4358
+ this.setText(this.Pages, this.totalRow);
4340
4359
  }
4341
4360
  }, (error) => {
4342
4361
  if (error.status == 401)
@@ -4360,11 +4379,37 @@ class PagingComponent {
4360
4379
  }
4361
4380
  return originalArray;
4362
4381
  }
4382
+ setText(pagesNumber, itemsNumber) {
4383
+ if (this.utilityService.isCurrentLanguageArabic()) {
4384
+ //Set pages text
4385
+ if (pagesNumber < 3 || pagesNumber > 10)
4386
+ this.pagesText = this.utilityService.getResourceValue("Page");
4387
+ else
4388
+ this.pagesText = this.utilityService.getResourceValue("Pages");
4389
+ //Set items text
4390
+ if (itemsNumber < 3 || itemsNumber > 10)
4391
+ this.itemsText = this.utilityService.getResourceValue("Item");
4392
+ else
4393
+ this.itemsText = this.utilityService.getResourceValue("Items");
4394
+ }
4395
+ else {
4396
+ //Set pages text
4397
+ if (pagesNumber > 1)
4398
+ this.pagesText = this.utilityService.getResourceValue("Pages");
4399
+ else
4400
+ this.pagesText = this.utilityService.getResourceValue("Page");
4401
+ //Set items text
4402
+ if (itemsNumber > 1)
4403
+ this.itemsText = this.utilityService.getResourceValue("Items");
4404
+ else
4405
+ this.itemsText = this.utilityService.getResourceValue("Item");
4406
+ }
4407
+ }
4363
4408
  }
4364
4409
  PagingComponent.decorators = [
4365
4410
  { type: Component, args: [{
4366
4411
  selector: 'BBSF-Paging',
4367
- template: "<div class=\"b-control b-paging\" *ngIf=\"(result.length > 0)\">\r\n <div class=\"d-flex justify-content-between align-items-center\" *ngIf=\"!options.IsLoadMoreControl\">\r\n <div class=\"b-pagination\">\r\n <jw-pagination [items]=\"items\" *ngIf=\"!((Pages==1)&&options.HidePaginationWhenPageSizeEqualOne)\"\r\n (changePage)=\"onChangePage($event)\" [pageSize]=\"options.PageSize\" [ShowFirstAndLast]=\"options.ShowFirstAndLast\"\r\n [initialPage]=\"1\" [maxPages]=\"10\"></jw-pagination>\r\n </div>\r\n <div class=\"b-pages d-flex\" *ngIf=\"!((Pages==1)&&options.HidePaginationWhenPageSizeEqualOne)\" >\r\n <select (change)=\"changePageSize($event)\" *ngIf=\"options.ShowPageSizeOption\">\r\n <option>10</option>\r\n <option>20</option>\r\n <option>50</option>\r\n <option>100</option>\r\n <option>200</option>\r\n </select>\r\n <div class=\"b-items ml-3\">\r\n <strong>{{totalRow}}</strong> {{utilityService.getResourceValue(\"ItemsIn\")}} <strong> {{Pages}}</strong> {{utilityService.getResourceValue(\"Pages\")}}\r\n </div>\r\n </div>\r\n </div>\r\n \r\n <div class=\"row\" style=\"align-self:center; align-items: center; text-align: center;\" *ngIf=\"options.IsLoadMoreControl\">\r\n <div class=\"search-results\" infinite-scroll [infiniteScrollDistance]=\"ScrollDistance\"\r\n [infiniteScrollUpDistance]=\"ScrollUpDistance\" [infiniteScrollThrottle]=\"Throttle\" (scrolled)=\"options.IsInfiniteScroll==true?onScrollDown():null\"\r\n [scrollWindow]=\"options.ScrollWindow\" [infiniteScrollContainer]=\"options.InfiniteScrollContainer\">\r\n </div>\r\n <button class=\"btn btn-info\" (click)=\"onScrollDown()\" *ngIf=\"!(result.length==totalRow)\">{{utilityService.getResourceValue(\"LoadMore\")}}</button>\r\n </div>\r\n</div>\r\n",
4412
+ template: "<div class=\"b-control b-paging\" *ngIf=\"(result.length > 0)\">\r\n <div class=\"d-flex justify-content-between align-items-center\" *ngIf=\"!options.IsLoadMoreControl\">\r\n <div class=\"b-pagination\">\r\n <jw-pagination [items]=\"items\" *ngIf=\"!((Pages==1)&&options.HidePaginationWhenPageSizeEqualOne)\"\r\n (changePage)=\"onChangePage($event)\" [pageSize]=\"options.PageSize\" [ShowFirstAndLast]=\"options.ShowFirstAndLast\"\r\n [initialPage]=\"1\" [maxPages]=\"10\"></jw-pagination>\r\n </div>\r\n <div class=\"b-pages d-flex\" *ngIf=\"!((Pages==1)&&options.HidePaginationWhenPageSizeEqualOne)\" >\r\n <select (change)=\"changePageSize($event)\" *ngIf=\"options.ShowPageSizeOption\">\r\n <option>10</option>\r\n <option>20</option>\r\n <option>50</option>\r\n <option>100</option>\r\n <option>200</option>\r\n </select>\r\n <div class=\"b-items ml-3\">\r\n <strong>{{totalRow}}</strong> {{itemsText}} {{utilityService.getResourceValue(\"In\")}} <strong> {{Pages}}</strong> {{pagesText}}\r\n </div>\r\n </div>\r\n </div>\r\n \r\n <div class=\"row\" style=\"align-self:center; align-items: center; text-align: center;\" *ngIf=\"options.IsLoadMoreControl\">\r\n <div class=\"search-results\" infinite-scroll [infiniteScrollDistance]=\"ScrollDistance\"\r\n [infiniteScrollUpDistance]=\"ScrollUpDistance\" [infiniteScrollThrottle]=\"Throttle\" (scrolled)=\"options.IsInfiniteScroll==true?onScrollDown():null\"\r\n [scrollWindow]=\"options.ScrollWindow\" [infiniteScrollContainer]=\"options.InfiniteScrollContainer\">\r\n </div>\r\n <button class=\"btn btn-info\" (click)=\"onScrollDown()\" *ngIf=\"!(result.length==totalRow)\">{{utilityService.getResourceValue(\"LoadMore\")}}</button>\r\n </div>\r\n</div>\r\n",
4368
4413
  styles: [".ngx-pager-container{text-align:center;padding:25px 0 0}.ngx-pager-container li{display:inline-block;margin:0 4px}.ngx-pager-container li a{display:block;width:26px;height:26px;border:1px solid #707070;text-align:center;color:#3e4e59;font-size:14px;line-height:24px;border-radius:5px;text-decoration:none}.ngx-pager-container li a:hover{color:#fff;background:#0a0e03}.ngx-pager-container li.invisible{display:none}.ngx-pager-container li.active{background:#0a0e03;border-radius:5px}.ngx-pager-container li.active a{border:none;color:#fff}\n"]
4369
4414
  },] }
4370
4415
  ];
@@ -4790,7 +4835,7 @@ class TextboxComponent {
4790
4835
  this.PasswordComplexityHasSmallLetter = this.UtilityService.getResourceValue("PasswordComplexityHasSmallLetter");
4791
4836
  this.PasswordComplexityHasSpecialLetter = this.UtilityService.getResourceValue("PasswordComplexityHasSpecialLetter");
4792
4837
  this.MaxWordCountValidationKey = this.UtilityService.getResourceValue("MaxWordCountValidationKey");
4793
- this.ArabicLetterOnly = this.UtilityService.getResourceValue("ArabicLetterOnly");
4838
+ this.ArabicLetterOnly = this.UtilityService.getResourceValue("ArabicIsRequiredAndOnly50CharactersEnglish");
4794
4839
  this.EnglishLetterOnly = this.UtilityService.getResourceValue("EnglishLetterOnly");
4795
4840
  }
4796
4841
  onTextChange() {
@@ -5339,10 +5384,20 @@ class FormComponent {
5339
5384
  this.modalService = modalService;
5340
5385
  this.ngbActiveModal = ngbActiveModal;
5341
5386
  this.router = router;
5387
+ this.isChange = null;
5388
+ this.OnChange = new EventEmitter();
5342
5389
  }
5343
5390
  ngOnInit() {
5344
5391
  this.fromName = this.randomString(5);
5345
5392
  }
5393
+ ngAfterViewInit() {
5394
+ this.options.FormGroup.valueChanges.subscribe((es) => {
5395
+ if (this.isChange != null)
5396
+ this.OnChange.emit(this.isChange);
5397
+ else
5398
+ this.isChange = true;
5399
+ });
5400
+ }
5346
5401
  submit() {
5347
5402
  this.options.FormGroup.markAllAsTouched();
5348
5403
  if (this.options.FormGroup.invalid) {
@@ -5417,6 +5472,7 @@ FormComponent.ctorParameters = () => [
5417
5472
  { type: Router }
5418
5473
  ];
5419
5474
  FormComponent.propDecorators = {
5475
+ OnChange: [{ type: Output }],
5420
5476
  options: [{ type: Input }]
5421
5477
  };
5422
5478
 
@@ -5714,6 +5770,7 @@ var DataType;
5714
5770
  DataType["CoverPhoto"] = "9CC8C0BB-C670-466F-A632-8632FF5C1296";
5715
5771
  DataType["InnovationLab"] = "4B914ED0-8B36-4E24-B85E-9A04C9F266BE";
5716
5772
  DataType["Country"] = "342AA701-76C7-4E5D-8056-407BFC86F888";
5773
+ DataType["AreaOfFocus"] = "06a4cfb7-216a-4a60-8388-7a859aab90b4";
5717
5774
  })(DataType || (DataType = {}));
5718
5775
 
5719
5776
  var ForceDirection;
@@ -5724,6 +5781,8 @@ var ForceDirection;
5724
5781
 
5725
5782
  class ControlOptionsBase {
5726
5783
  constructor() {
5784
+ /** Sets an attribute disable="disabled" */
5785
+ this.IsDisabled = false;
5727
5786
  /** to set type of view if Control is Vertical or Horizontal */
5728
5787
  this.ViewType = null;
5729
5788
  /** Allow to Pass Object With Body of Function which represent CustomValidation and massage for error massage */
@@ -5736,6 +5795,8 @@ class DatePickerOptions extends ControlOptionsBase {
5736
5795
  super(...arguments);
5737
5796
  /**To set First Day Of Week to DatePicker */
5738
5797
  this.FirstDayOfWeek = 1;
5798
+ /**To set Hour12Timer to DatePicker is 12 Hour or 24 Hour*/
5799
+ this.Hour12Timer = true;
5739
5800
  /**To set PickerType to DatePicker is Calendar or Timer Or Both */
5740
5801
  this.PickerType = PickerType.Calendar;
5741
5802
  /**To set StartView to DatePicker is Year or Month Or Multi-Year */
@@ -5837,8 +5898,8 @@ class TextBoxOptions extends ControlOptionsBase {
5837
5898
  super(...arguments);
5838
5899
  /** set Range Number to Textbox with type number with From-Value and To-value*/
5839
5900
  this.NumberRange = new RangeNumber();
5840
- /**Prevent AutoComplete of textbox*/
5841
- this.AutoComplete = "off";
5901
+ /**Prevent AutoComplete of textbox default value is "on" available values "on" and "off"*/
5902
+ this.AutoComplete = "on";
5842
5903
  /** to set Direction of textbox if textbox is Arabic or English */
5843
5904
  this.ForceDirection = null;
5844
5905
  /** to set Language of textbox if textbox language is Arabic or English */
@@ -6951,6 +7012,8 @@ class MultiLingualTextBoxOptions extends MultilingualControlOptionsBase {
6951
7012
  this.IconPositionAR = IconPosition.right;
6952
7013
  /*multi control placement type*/
6953
7014
  this.MultiControlPlacementType = null;
7015
+ /**Prevent AutoComplete of inputs default value is "on" available values "on" and "off"*/
7016
+ this.AutoComplete = "on";
6954
7017
  }
6955
7018
  }
6956
7019
 
@@ -7088,8 +7151,6 @@ class TagsInputOptions extends ControlOptionsBase {
7088
7151
  this.DatasourceItemValue = "key";
7089
7152
  /**Text Of Tag That Will Show In Dropdown */
7090
7153
  this.DatasourceItemText = "value";
7091
- /**Text Show when none of the given options match the entered text */
7092
- this.NoResultText = "No Item Matches";
7093
7154
  /**Set Query Param Name By Default It's 'query'*/
7094
7155
  this.QueryParamName = "query";
7095
7156
  /**Set Query Param Name By Default It's 'query'*/
@@ -7539,7 +7600,7 @@ var FileType;
7539
7600
  FileType["ZIP"] = "application/zip";
7540
7601
  FileType["RAR"] = "application/x-rar-compressed";
7541
7602
  FileType["VIDEO"] = "video/webm,video/ogg,video/mp4,video/quicktime,video/x-msvideo,video/x-ms-wmv";
7542
- FileType["License"] = "application/octet-stream";
7603
+ FileType["License"] = "application/BN";
7543
7604
  FileType["Xml"] = "text/xml";
7544
7605
  FileType["OctetSteam"] = "application/octet-stream";
7545
7606
  FileType["Txt"] = "text/plain";