nuxeo-development-framework 4.1.4 → 4.1.6

package/src/lib/components/file-manger/components/update-modal/update-modal.component.ts

@@ -0,0 +1,371 @@
+import { AfterViewInit, Component, HostListener, Inject, OnInit } from '@angular/core';
+import { FormBuilder, FormGroup, Validators } from '@angular/forms';
+import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
+import { DynamicFormService } from '../../../../shared-services/dynamic-form.service';
+import { FileManagerService } from '../../../../shared-services/file-manager.service';
+import { Utils } from 'formiojs';
+import { forkJoin, Subscription } from 'rxjs';
+import { CustomToastrService } from '../../../custom-toastr/services/custom-toastr.service';
+import { AppConfigService } from '../../../../configuration/app-config.service';
+import { AdapterService } from '../../../../core/adapters/adapter.service' ;
+import { TranslationService } from '../../../../core/services/translation/translation.service';
+import { DateHelperService } from '../../../hijri-gregorian-datepicker/services/date-helper.service';
+import { DocumentsService } from '../../../documents/services/documents.service';
+@Component({
+   selector: 'app-update-modal',
+   templateUrl: './update-modal.component.html',
+   styleUrls: ['./update-modal.component.scss']
+})
+export class UpdateModalComponent implements OnInit {
+   type;
+   dynamicForm;
+   temporaryDyanmicData = {};
+   myEnvironment;
+   showRenderer = false;
+   dynamicData = {
+      valid: false
+   };
+   id = '';
+   isDirectory = false;
+   fileForm : FormGroup;
+   fileFormSubscription : Subscription;
+   agencyCategCodeSubscription : Subscription;
+   countryCategCodeSubscription : Subscription;
+   isArabic = false;
+   showStaticForm = false
+   usingExtraFields = false; // flage to switch between static form types
+   staticFormFields;
+   agencyNameFilter ;
+   countryNameFilter;
+   translationSubcription : Subscription;
+   fields = [
+      {
+        type : 'text',
+        label : "CREATE.DOCUMENT_SUBJECT",
+        formControlName : "subject",
+        placeholder : "CREATE.DOCUMENT_SUBJECT",
+        required : true,
+        permission : 'isHiddenField'
+      },
+      {
+        type : 'text',
+        label : "CREATE.DOCUMENT_NUMBER",
+        formControlName : "documentNumber",
+        placeholder : "CREATE.DOCUMENT_NUMBER",
+        required : false,
+        permission : 'isHiddenField'
+      },
+      {
+        type : 'date',
+        label : "CREATE.DOCUMENT_DATE",
+        formControlName : "gdocumentDate",
+        permission : 'isHiddenField'
+      },
+      {
+        type : 'dynamic-vocabulary',
+        label : "CREATE.SCRECY_LEVEL",
+        bindLabel : 'label',
+        bindValue : 'id',
+        multiple : false,
+        searchable : false,
+        closeOnSelect : true, 
+        hideSelectedItems : false,
+        disabled : false,
+        vocabularyType : 'VOC_SecrecyLevel',
+        formControlName : "secrecyLevel",
+        placeholder : "VOCABULARY.SELECT_ITEM",
+        permission : 'isHiddenField'
+      },
+      {
+        type : 'dynamic-vocabulary',
+        label : "CREATE.IMPORTANCE_LEVEL",
+        bindLabel : 'label',
+        bindValue : 'id',
+        multiple : false,
+        searchable : false,
+        closeOnSelect : true, 
+        disabled : false,
+        hideSelectedItems : false,
+        vocabularyType : 'VOC_Importance',
+        formControlName : "importanceLevel",
+        placeholder : "VOCABULARY.SELECT_ITEM",
+        permission : 'isHiddenField'
+      },
+      {
+        type : 'department-selector',
+        label : "CREATE.DEPARTMENT_CODE",
+        formControlName : "departmentCode",
+        placeholder : "please select department",
+        pp_departmentNestedTree : "PP_OS_Departments",
+        pp_departmentTree : "PP_OS_Departments",
+        customPrefix : "osdept",
+        customParentProperty : "osdepartment_parentDepartmentCode",
+        useCustomAddEditAction : true,
+        required : false,
+        permission : 'isHiddenField'
+      },
+      {
+        type : 'translated-vocabulary',
+        label : "CREATE.AGENCY_CATEGORY_CODE",
+        arbBindLabel : 'label_ar',
+        engBindLabel : "label_en",
+        bindValue : 'id',
+        multiple : false,
+        searchable : false,
+        closeOnSelect : true, 
+        hideSelectedItems : false,
+        vocbularyId : 'VOC_AgencyCategory',
+        formControlName : "agencyCategoryCode",
+        placeholder : "VOCABULARY.SELECT_ITEM",
+        useFilter: false,
+        filter : '',
+        permission : 'isHiddenField'
+      },
+      {
+        type : 'translated-vocabulary',
+        label : "CREATE.AGENCY_NAME",
+        arbBindLabel : 'label_ar',
+        engBindLabel : "label_en",
+        bindValue : 'id',
+        multiple : false,
+        searchable : true,
+        closeOnSelect : true, 
+        hideSelectedItems : false,
+        vocbularyId : 'VOC_Agency',
+        formControlName : "agencyName",
+        placeholder : "VOCABULARY.SELECT_ITEM",
+        useFilter: true,
+        filter : 'agencyName',
+        permission : 'isHiddenField'
+      },
+      {
+        type : 'translated-vocabulary',
+        label : "CREATE.COUNTRY_CATEGORY_CODE",
+        arbBindLabel : 'label_ar',
+        engBindLabel : "label_en",
+        bindValue : 'id',
+        multiple : false,
+        searchable : true,
+        closeOnSelect : true, 
+        hideSelectedItems : false,
+        vocbularyId : 'VOC_CountryCategory',
+        formControlName : "countryCategoryCode",
+        placeholder : "VOCABULARY.SELECT_ITEM",
+        useFilter: false,
+        filter : '',
+        permission : 'isHiddenField'
+      },
+      {
+        type : 'translated-vocabulary',
+        label : "CREATE.COUNTRY_NAME",
+        arbBindLabel : 'label_ar',
+        engBindLabel : "label_en",
+        bindValue : 'id',
+        multiple : false,
+        searchable : true,
+        closeOnSelect : true, 
+        hideSelectedItems : false,
+        vocbularyId : 'VOC_Country',
+        formControlName : "countryName",
+        placeholder : "VOCABULARY.SELECT_ITEM",
+        useFilter: true,
+        filter : 'countryName',
+        permission : 'isHiddenField'
+      },
+      {
+        type : 'text',
+        label : "CREATE.REMARKS",
+        formControlName : "remarks",
+        placeholder : "CREATE.REMARKS",
+        required : false,
+        permission : 'isHiddenField'
+      }
+    ] ;
+   translatedDocumentType;
+   code;
+   @HostListener('document:keyup.enter', ['$event'])
+   KeyUpEvent(event: KeyboardEvent) {
+     if((this.dynamicData['data'] && this.dynamicData.valid) && this.fileForm.valid && this.fileForm.value.title != '..') {
+       this.UpdateDocument();
+     }
+   }
+   constructor(@Inject(MAT_DIALOG_DATA) public data,
+   @Inject('environment') public environment,
+      private dialogRef: MatDialogRef<UpdateModalComponent>,
+      private fileMangerService: FileManagerService,
+      private tosterService: CustomToastrService,
+      private formBuilder: FormBuilder,
+      private appConfService : AppConfigService,
+      private dynamicFormService: DynamicFormService,
+      private adapter : AdapterService,
+      private translationService : TranslationService,
+      private dateHelperService : DateHelperService,
+      private documentService: DocumentsService) { 
+         this.type = this.data.type;
+         this.code = this.data.code;
+         this.id = this.data.id;
+         this.isDirectory = this.data.isDirectory;
+         this.initiatfileForm();
+
+      }
+   customeHeader = 'lock,dc:creator';
+   userSelectorKeys = [];
+   ngOnInit(): void {
+      this.translationSubcription = this.translationService.isArabic.subscribe(res => {
+         this.isArabic = res;
+      })
+      let collectData = {};
+
+      this.dynamicFormService.getDynamicForm(this.code ? this.code : this.type).subscribe(form => {
+         if(form && form['components'] && form['components'].length > 0){
+            let prefix = form.prefix;
+            this.dynamicForm = form;
+            Utils.eachComponent( form.components , (comp) => {
+               if (comp.type === "userSelector") {
+                  this.userSelectorKeys.push(comp.fixedKey);
+                  let compPrefix = prefix[comp.fixedKey] ? prefix[comp.fixedKey] : '';
+                  if (compPrefix) {
+                     this.customeHeader = this.customeHeader + ',' + compPrefix + ':' + comp.fixedKey
+                  } else {
+                     this.customeHeader = this.customeHeader + ',' + comp.fixedKey
+                  }
+               }
+            });
+         }
+         this.fileMangerService.getFileSchemas(this.type).subscribe(schemas => {
+            schemas.map(item => {
+              if(item.name === "generaldocument"){
+                this.usingExtraFields = true;
+              }
+            });
+
+            this.initiatfileForm();
+
+            this.documentService.getDocument(this.id, { 'X-NXfetch-document': this.customeHeader }).subscribe(response => {
+               this.translatedDocumentType = response['documentType'];
+               this.adapter.adaptIn(response , this.staticFormFields);
+               if(this.dynamicForm && this.dynamicForm['components'] && this.dynamicForm['components'].length > 0){
+                  Utils.eachComponent(this.dynamicForm.components,(comp) => {
+                     if(this.userSelectorKeys.indexOf(comp.fixedKey) > -1){
+                        collectData[':' + comp.fixedKey] ={
+                           userSelector : true,
+                           value : response.properties[this.dynamicForm.prefix[comp.fixedKey] + ':' + comp.fixedKey]
+                        } 
+                     }else{
+                        collectData[':' + comp.fixedKey] = response.properties[this.dynamicForm.prefix[comp.fixedKey] + ':' + comp.fixedKey]
+                     }
+                  })
+               }
+               this.temporaryDyanmicData = { ...collectData };
+               this.showRenderer = true;
+               this.fileForm.patchValue(response.properties);
+               if(this.fileForm.value['agencyCategoryCode']){
+                  this.agencyNameFilter = {
+                    category : this.fileForm.value['agencyCategoryCode']
+                  };
+                  this.agencyCategCodeSubscription =  this.fileForm.get('agencyCategoryCode').valueChanges.subscribe(res => {
+                     this.fileForm.get('agencyName').setValue(null);
+                         this.agencyNameFilter = {
+                           category : res
+                         };
+                   })
+                }
+                if(this.fileForm.value['countryCategoryCode']){
+                  this.countryNameFilter = {
+                    category : this.fileForm.value['countryCategoryCode']
+                  };
+                  
+                this.countryCategCodeSubscription =  this.fileForm.get('countryCategoryCode').valueChanges.subscribe(res => {
+                  this.fileForm.get('countryName').setValue(null);
+                  this.countryNameFilter = {
+                    category : res
+                  };
+                })
+                }
+
+               if(this.fileForm.contains('secrecyLevel') && this.fileForm.get('secrecyLevel').value !== null && this.fileForm.get('secrecyLevel').value !== 'Normal' ){
+                  this.fields[3].disabled = true;
+               } 
+                this.fileForm.valueChanges.subscribe(res => {
+                   console.log(this.fileForm);
+                })
+   
+            })
+         })
+
+      })
+  }
+
+  initiatfileForm(){
+   if(this.usingExtraFields && !this.isDirectory){
+     this.fileForm = this.formBuilder.group({
+       title : ['' , [Validators.required]],
+       description : [''],
+       subject : ['' , [Validators.required]],
+       documentNumber : [''],
+       gdocumentDate : [null , [Validators.required]],
+       secrecyLevel : [null],
+       importanceLevel:[null],
+       departmentCode:[''],
+       agencyCategoryCode:[null],
+       agencyName:[null],
+       countryCategoryCode:[null],
+       countryName:[null],
+       remarks:['']
+     })
+   }else{
+     this.fileForm = this.formBuilder.group({
+       title : ['' , [Validators.required]],
+       description : ['']
+     })
+   }
+   this.staticFormFields = this.appConfService.myConfiguration.staticFormFields;
+ }
+   ondynamicFormChange(dynamicData) {
+      if (dynamicData.data) {
+         console.log(dynamicData.data)
+         this.dynamicData = { ...dynamicData };
+      }
+   }
+   closeDialog() {
+      this.dialogRef.close(false);
+   }
+
+   UpdateDocument() {
+      let params = this.constructPayLoad(this.dynamicData['data'], this.fileForm.value);
+      this.fileMangerService.UpdateFolder(params, this.id).subscribe(res => {
+         //console.log(res);
+         this.fileMangerService.onRefreshingFileManger.next();
+         this.tosterService.show('success', 'TOASTER.SUCCESS', "TOASTER.FOLDER_UPDATED_SUCCE");
+         this.closeDialog();
+      })
+
+   }
+
+   constructPayLoad(dynamicValues, staticForm) {
+      let props = this.dynamicForm ? this.dynamicFormService.constructDynamicFormPayload(dynamicValues , this.dynamicForm) : {};
+      let staticFormData = this.mappingStaticData(staticForm)
+         return {
+            "type": this.type,
+            "name": staticForm.title,
+            "save": "true",
+            "properties": {
+               ...props,
+               ...staticFormData
+            }
+         };
+   }
+
+   mappingStaticData(data){
+      if(data.gdocumentDate && data.gdocumentDate !== null){
+        data['hdocumentDate'] = this.dateHelperService.gregorianToHijri(data.gdocumentDate,'iYYYY-iMM-iDD')
+      }
+      return this.adapter.adaptOut(data , this.staticFormFields)
+    }
+
+   ngOnDestroy(){
+      this.agencyCategCodeSubscription ? this.agencyCategCodeSubscription.unsubscribe() : null;
+      this.countryCategCodeSubscription ? this.countryCategCodeSubscription.unsubscribe() : null;
+      this.translationSubcription ? this.translationSubcription.unsubscribe() : null;
+   }
+}

package/src/lib/components/file-manger/directives/file-grid-infinite-scroll.directive.ts

@@ -0,0 +1,72 @@
+import { AfterViewInit, Directive, EventEmitter, Input, Output } from "@angular/core";
+import { DxFileManagerComponent } from "devextreme-angular";
+import { Subject } from 'rxjs';
+import { debounceTime } from "rxjs/operators";
+
+@Directive({
+    selector: '[ndfFileGridInfiniteScroll]'
+})
+export class FileGridInfiniteScrollDirective implements AfterViewInit {
+    @Input('ndfFileGridInfiniteScroll') fileManager: DxFileManagerComponent;
+    @Input() infiniteScrollDistance: number = 5;
+    @Output() scrolled = new EventEmitter<void>();
+
+    #scrollSubject = new Subject<void>();
+    #scrollHandler: () => void;
+    #isNodeChanging = false;
+
+    ngAfterViewInit() {
+        this.fileManager.instance.on('contentReady', (e) => {
+            this.#handleViewModeChanged();
+        });
+
+        this.fileManager.instance.on('optionChanged', (e) => {
+            if (e.fullName === 'itemView.mode') {
+                this.#handleViewModeChanged();
+            }
+            else if (e.fullName === 'currentPath') {
+                this.#isNodeChanging = true;
+                this.#handleViewModeChanged();
+                setTimeout(() => { this.#isNodeChanging = false; }, 1000);
+            }
+        });
+
+        this.#scrollSubject.pipe(
+            debounceTime(500)
+        ).subscribe(() => {
+            this.scrolled.emit();
+            console.log('scroll trigered');
+        });
+    }
+
+    #handleViewModeChanged() {
+        try {
+            this.#removeListener();
+            setTimeout(() => {
+                const scrollableElement = (this.fileManager as any).instance._itemView._$element[0].getElementsByClassName('dx-scrollable-container')[0];
+
+                // Define the event handler function
+                const onScroll = () => {
+                    if (this.#isNodeChanging) return;
+                    const scrollTop = scrollableElement.scrollTop;
+                    const scrollHeight = scrollableElement.scrollHeight;
+                    const clientHeight = scrollableElement.clientHeight;
+
+                    if (scrollTop + clientHeight >= scrollHeight - this.infiniteScrollDistance) {
+                        this.#scrollSubject.next();
+                    }
+                };
+
+                this.#scrollHandler = onScroll;
+                scrollableElement.addEventListener('scroll', onScroll);
+            }, 100);
+        } catch (e) { }
+    }
+
+    #removeListener() {
+        const scrollableElement = (this.fileManager as any).instance._itemView._$element[0].getElementsByClassName('dx-scrollable-container')[0];
+        if (this.#scrollHandler) {
+            scrollableElement.removeEventListener('scroll', this.#scrollHandler);
+        }
+    }
+}