nuxeo-development-framework 3.5.4 → 3.5.5

package/bundles/nuxeo-development-framework.umd.js

@@ -4562,13 +4562,13 @@
         };
         CorrespondenceRelationService.prototype.search = function (val, query, type) {
             if (query === void 0) { query = ''; }
-            var params = Object.assign({ pageProvider: type == 'relationFile' ? 'PP_Correspondence_RelationSeach' : 'PP_Correspondences_Elastic', currentPageIndex: 0, offset: 0, pageSize: 1000, system_fulltext: val }, query);
+            var params = Object.assign({ pageProvider: type == 'relationFile' ? 'PP_Correspondence_RelationSeach' : 'PP_Correspondences_Elastic', currentPageIndex: 0, offset: 0, pageSize: 20, system_fulltext: val + '*' }, query);
             if (this.nuxeoService.nuxeoClient.user.properties.tenantId) {
                 params['queryParams'] = "/" + this.nuxeoService.nuxeoClient.user.properties.tenantId + "/";
             }
             return this.callApi
                 .query(params, {
-                headers: { 'X-NXproperties': '*' },
+                headers: { 'X-NXproperties': 'Correspondence' },
             })
                 .pipe(operators.map(function (data) {
                 var results = [];
@@ -6663,7 +6663,7 @@
     DynamicFormDateItemComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: DynamicFormDateItemComponent, deps: [{ token: DynamicFormUpdateService }, { token: i2__namespace$5.DateAdapter }, { token: UserPreferencesService$1 }, { token: i1__namespace$1.TranslateService }, { token: i6__namespace.NgControl, optional: true, self: true }], target: i0__namespace.ɵɵFactoryTarget.Component });
     DynamicFormDateItemComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.4", type: DynamicFormDateItemComponent, selector: "app-dynamic-form-dateitem", inputs: { label: "label", disabled: "disabled", property: "property", editable: "editable", displayEmpty: "displayEmpty", min: "min", max: "max", startAt: "startAt", displayClearAction: "displayClearAction", pickerType: "pickerType", selectMode: "selectMode", isfilter: "isfilter", placeholder: "placeholder" }, providers: [
             { provide: i6$1.OWL_DATE_TIME_FORMATS, useValue: MY_MOMENT_FORMATS }
-        ], viewQueries: [{ propertyName: "datepicker", first: true, predicate: ["datetimePicker"], descendants: true }], ngImport: i0__namespace, template: "<div class=\"app-property-value\">\r\n  <div class=\"app-input-wrapper\">\r\n    <ng-container *ngIf=\"label\">\r\n      <label class=\"\" for=\"formGroupInputSmall\"\r\n        >{{ label | translate\r\n        }}<span *ngIf=\"isRequired()\" class=\"text-danger m-1\">*</span>\r\n      </label>\r\n    </ng-container>\r\n    <div class=\"input-container\">\r\n      <ng-container *ngIf=\"isEditable(); else readOnly\">\r\n\r\n        <button *ngIf=\"!isfilter && pickerType !== 'timer'\" type=\"button\" class=\"claendar-icon\" [owlDateTimeTrigger]=\"dt3\">\r\n          <i class=\"bi bi-calendar-week icon\"></i>        </button>\r\n\r\n          <button *ngIf=\"!isfilter && pickerType === 'timer'\" type=\"button\" class=\"claendar-icon\" [owlDateTimeTrigger]=\"dt3\">\r\n            <i class=\"bi bi-clock icon\"></i>        </button>\r\n        <input\r\n          class=\"form-control date\"\r\n          [disabled]=\"isDisabled() || null\"\r\n          (blur)=\"onTouched($event)\"\r\n          [min]=\"min\"\r\n          [max]=\"max\"\r\n          [selectMode]=\"selectMode\"\r\n          [required]=\"isRequired\"\r\n          [(ngModel)]=\"valueDate\"\r\n          (ngModelChange)=\"onDateChanged($event)\"\r\n          autocomplete=\"false\"\r\n          [owlDateTimeTrigger]=\"dt3\"\r\n          [owlDateTime]=\"dt3\"\r\n          placeholder=\"{{ placeholder }}\"\r\n        />\r\n        <input\r\n        class=\"form-control timer\"\r\n        [disabled]=\"true\"\r\n        [required]=\"isRequired\"\r\n        [(ngModel)]=\"displayedTime\"\r\n        placeholder=\"{{ placeholder }}\"\r\n      />\r\n        <button type=\"button\" *ngIf=\"valueDate\" (click)=\"onDateClear()\" class=\"relative mx-1 clear-date-btn\"\r\n        [ngClass]=\"{'d-none': isDisabled()}\">\r\n          <i class=\"clear-date-icon material-icons  flex mr-1\">&#xE14C;</i>\r\n        </button>\r\n        <owl-date-time\r\n          [startAt]=\"startAt\"\r\n          [pickerType]=\"pickerType\"\r\n          #dt3\r\n        ></owl-date-time>\r\n\r\n        <mat-error\r\n          [attr.data-automation-id]=\"'card-textitem-error-'\"\r\n          class=\"app-textitem-editable-error\"\r\n          *ngIf=\"hasErrors()\"\r\n        >\r\n          <ul>\r\n            <li *ngIf=\"control.errors.required\">\r\n             <span *ngIf=\"label\" class=\"mx-1\">{{ label | translate}}</span> {{ \"VALIDATORS.REQUIRED\" | translate }}\r\n            </li>\r\n          </ul>\r\n        </mat-error>\r\n      </ng-container>\r\n      <ng-template #readOnly>\r\n        {{ valueDate | date }}\r\n      </ng-template>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".clear-date-icon{color:#999;font-size:15px}.input-container{position:relative}.input-container .form-control{padding:0 35px}.clear-date-btn{align-items:center;background:transparent;border:0px;position:absolute;right:10px;left:auto;top:50%;margin-top:-9px}.claendar-icon{border:none;background-color:transparent;position:absolute;top:5px}.claendar-icon .icon{font-size:20px;color:#495057}.claendar-icon:focus{outline:none}.rtl .clear-date-btn{left:10px;right:auto}.rtl .owl-dt-container-info{direction:rtl}\n"], components: [{ type: i6__namespace$1.OwlDateTimeComponent, selector: "owl-date-time", inputs: ["backdropClass", "panelClass", "startAt", "pickerType", "pickerMode", "disabled", "opened", "scrollStrategy"], outputs: ["afterPickerClosed", "afterPickerOpen", "yearSelected", "monthSelected"], exportAs: ["owlDateTime"] }], directives: [{ type: i3__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6__namespace$1.OwlDateTimeTriggerDirective, selector: "[owlDateTimeTrigger]", inputs: ["disabled", "owlDateTimeTrigger"] }, { type: i6__namespace.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i6__namespace$1.OwlDateTimeInputDirective, selector: "input[owlDateTime]", inputs: ["rangeSeparator", "value", "owlDateTime", "owlDateTimeFilter", "_disabled", "min", "max", "selectMode", "values"], outputs: ["dateTimeChange", "dateTimeInput"], exportAs: ["owlDateTimeInput"] }, { type: i6__namespace.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i6__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i6__namespace.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i3__namespace$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i6__namespace$2.MatError, selector: "mat-error", inputs: ["id"] }], pipes: { "translate": i1__namespace$1.TranslatePipe, "date": i3__namespace$1.DatePipe }, encapsulation: i0__namespace.ViewEncapsulation.None });
+        ], viewQueries: [{ propertyName: "datepicker", first: true, predicate: ["datetimePicker"], descendants: true }], ngImport: i0__namespace, template: "<div class=\"app-property-value\">\r\n  <div class=\"app-input-wrapper\">\r\n    <ng-container *ngIf=\"label\">\r\n      <label class=\"\" for=\"formGroupInputSmall\"\r\n        >{{ label | translate\r\n        }}<span *ngIf=\"isRequired()\" class=\"text-danger m-1\">*</span>\r\n      </label>\r\n    </ng-container>\r\n    <div class=\"input-container\">\r\n      <ng-container *ngIf=\"isEditable(); else readOnly\">\r\n\r\n        <button *ngIf=\"!isfilter && pickerType !== 'timer'\" type=\"button\" class=\"claendar-icon\" [owlDateTimeTrigger]=\"dt3\">\r\n          <i class=\"bi bi-calendar-week icon\"></i>        </button>\r\n\r\n          <button *ngIf=\"!isfilter && pickerType === 'timer'\" type=\"button\" class=\"claendar-icon\" [owlDateTimeTrigger]=\"dt3\">\r\n            <i class=\"bi bi-clock icon\"></i>        </button>\r\n        <input\r\n          class=\"form-control date\"\r\n          [disabled]=\"isDisabled() || null\"\r\n          (blur)=\"onTouched($event)\"\r\n          [min]=\"min\"\r\n          [max]=\"max\"\r\n          [selectMode]=\"selectMode\"\r\n          [required]=\"isRequired\"\r\n          [(ngModel)]=\"valueDate\"\r\n          (ngModelChange)=\"onDateChanged($event)\"\r\n          autocomplete=\"false\"\r\n          [owlDateTimeTrigger]=\"dt3\"\r\n          [owlDateTime]=\"dt3\"\r\n          placeholder=\"{{ placeholder }}\"\r\n        />\r\n        <input\r\n        class=\"form-control timer\"\r\n        [disabled]=\"true\"\r\n        [owlDateTimeTrigger]=\"dt3\"\r\n        [owlDateTime]=\"dt3\"\r\n        [required]=\"isRequired\"\r\n        [(ngModel)]=\"displayedTime\"\r\n        placeholder=\"{{ placeholder }}\"\r\n      />\r\n\r\n        <button type=\"button\" *ngIf=\"valueDate\" (click)=\"onDateClear()\" class=\"relative mx-1 clear-date-btn\"\r\n        [ngClass]=\"{'d-none': isDisabled()}\">\r\n          <i class=\"clear-date-icon material-icons  flex mr-1\">&#xE14C;</i>\r\n        </button>\r\n        <owl-date-time\r\n          [startAt]=\"startAt\"\r\n          [pickerType]=\"pickerType\"\r\n          #dt3\r\n        ></owl-date-time>\r\n\r\n        <mat-error\r\n          [attr.data-automation-id]=\"'card-textitem-error-'\"\r\n          class=\"app-textitem-editable-error\"\r\n          *ngIf=\"hasErrors()\"\r\n        >\r\n          <ul>\r\n            <li *ngIf=\"control.errors.required\">\r\n             <span *ngIf=\"label\" class=\"mx-1\">{{ label | translate}}</span> {{ \"VALIDATORS.REQUIRED\" | translate }}\r\n            </li>\r\n          </ul>\r\n        </mat-error>\r\n      </ng-container>\r\n      <ng-template #readOnly>\r\n        {{ valueDate | date }}\r\n      </ng-template>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".clear-date-icon{color:#999;font-size:15px}.input-container{position:relative}.input-container .form-control{padding:0 35px}.clear-date-btn{align-items:center;background:transparent;border:0px;position:absolute;right:10px;left:auto;top:50%;margin-top:-9px}.claendar-icon{border:none;background-color:transparent;position:absolute;display:flex;justify-content:flex-start;padding-inline-end:45px;width:100%;height:40px;align-items:center}.claendar-icon .icon{font-size:20px;color:#495057}.claendar-icon:focus{outline:none}.rtl .clear-date-btn{left:10px;right:auto}.rtl .owl-dt-container-info{direction:rtl}\n"], components: [{ type: i6__namespace$1.OwlDateTimeComponent, selector: "owl-date-time", inputs: ["backdropClass", "panelClass", "startAt", "pickerType", "pickerMode", "disabled", "opened", "scrollStrategy"], outputs: ["afterPickerClosed", "afterPickerOpen", "yearSelected", "monthSelected"], exportAs: ["owlDateTime"] }], directives: [{ type: i3__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6__namespace$1.OwlDateTimeTriggerDirective, selector: "[owlDateTimeTrigger]", inputs: ["disabled", "owlDateTimeTrigger"] }, { type: i6__namespace.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i6__namespace$1.OwlDateTimeInputDirective, selector: "input[owlDateTime]", inputs: ["rangeSeparator", "value", "owlDateTime", "owlDateTimeFilter", "_disabled", "min", "max", "selectMode", "values"], outputs: ["dateTimeChange", "dateTimeInput"], exportAs: ["owlDateTimeInput"] }, { type: i6__namespace.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i6__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i6__namespace.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i3__namespace$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i6__namespace$2.MatError, selector: "mat-error", inputs: ["id"] }], pipes: { "translate": i1__namespace$1.TranslatePipe, "date": i3__namespace$1.DatePipe }, encapsulation: i0__namespace.ViewEncapsulation.None });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: DynamicFormDateItemComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -7855,7 +7855,7 @@
                 : this.getVocabularyList(type);
             callApi.subscribe(function (res) {
                 _this.loading = false;
-                _this.data = !_this.shwoAllValues ? res.filter(function (item) { return !item.id.includes('archived') && !item.id.includes('draft'); }) : res;
+                _this.data = !_this.shwoAllValues ? res.filter(function (item) { return !item.id.includes('archived') && !item.id.includes('draft'); }) : res.filter(function (item) { return item.obsolete === 0; });
                 _this.cdRef.detectChanges();
             });
         };
@@ -8043,7 +8043,7 @@
                 agencyCode: new i6.FormControl('tdf', i6.Validators.required),
                 arabicName: new i6.FormControl(null, i6.Validators.required),
                 englishName: new i6.FormControl(null, i6.Validators.required),
-                deptTypee: new i6.FormControl(null, i6.Validators.required),
+                deptTypee: this.data.displayDepTypee ? new i6.FormControl(null, i6.Validators.required) : new i6.FormControl(null),
                 description: new i6.FormControl(null),
                 isAllowRecExternal: new i6.FormControl(false),
                 // manager: new FormControl(null),
@@ -8136,7 +8136,7 @@
         return DepartmentFormComponent;
     }());
     DepartmentFormComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: DepartmentFormComponent, deps: [{ token: i1$5.MAT_DIALOG_DATA }, { token: i1__namespace$5.MatDialogRef }, { token: CustomToastrService }, { token: DepartmentApiService }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    DepartmentFormComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.4", type: DepartmentFormComponent, selector: "cts-department-form", ngImport: i0__namespace, template: "<div SetDirRtl class=\"voc-form\">\r\n  <div class=\"voc-form-hedaer\">\r\n    {{\r\n      \"department_management.form.\" + (updateMode ? \"updateHeader\" : \"header\")\r\n        | translate\r\n    }}\r\n  </div>\r\n  <form [formGroup]=\"departmentForm\" class=\"row voc-form-body\">\r\n    <div class=\"col-lg-6 col-12\">\r\n      <app-dynamic-form-textitem\r\n        formControlName=\"title\"\r\n        [label]=\"'department_management.form.title'\"\r\n        [disabled]=\"updateMode\"\r\n        [preventSpace]=\"true\"\r\n      ></app-dynamic-form-textitem>\r\n      <div class=\"hint-msg\">{{ \"department_management.form.hintMsg\" | translate }}</div>\r\n    </div>\r\n    <!-- <app-dynamic-form-textitem\r\n      class=\"col-lg-6 col-12\"\r\n      formControlName=\"agencyCode\"\r\n      [label]=\"'department_management.form.AgencyCode'\"\r\n    ></app-dynamic-form-textitem> -->\r\n    <app-dynamic-form-textitem\r\n      class=\"col-lg-6 col-12\"\r\n      formControlName=\"arabicName\"\r\n      [label]=\"'department_management.form.ArabicName'\"\r\n    ></app-dynamic-form-textitem>\r\n    <app-dynamic-form-textitem\r\n      class=\"col-lg-6 col-12\"\r\n      formControlName=\"englishName\"\r\n      [label]=\"'department_management.form.EnglishName'\"\r\n    ></app-dynamic-form-textitem>\r\n    <app-dynamic-form-vocabulary-item\r\n      class=\"col-lg-6 col-12\"\r\n      [label]=\"'department_management.form.deptTypee'\"\r\n      [bindLabel]=\"'label'\"\r\n      [bindValue]=\"'id'\"\r\n      placeholder=\"{{ 'VOCABULARY.SELECT_ITEM' | translate }}\"\r\n      [multiple]=\"false\"\r\n      [searchable]=\"false\"\r\n      [closeOnSelect]=\"true\"\r\n      [hideSelectedItems]=\"false\"\r\n      [vocabularyType]=\"'VOC_DepartmentType'\"\r\n      formControlName=\"deptTypee\"\r\n    >\r\n    </app-dynamic-form-vocabulary-item>\r\n    <app-dynamic-form-textitem\r\n      class=\"col-lg-6 col-12\"\r\n      formControlName=\"description\"\r\n      [label]=\"'department_management.form.Description'\"\r\n    ></app-dynamic-form-textitem>\r\n    <!-- <cts-dynamic-form-select-users\r\n      class=\"col-lg-6 col-12\"\r\n      formControlName=\"manager\"\r\n      [bindValue]=\"\"\r\n      [bindLabel]=\"\"\r\n      [label]=\"'department_management.form.Manager'\"\r\n      [deptTitle]=\"'all'\"\r\n      [bindValue]=\"'properties.username'\"\r\n    ></cts-dynamic-form-select-users> -->\r\n\r\n    <cts-dynamic-form-slide-toggleitem\r\n      class=\"col-lg-6 col-12 isAllowRecExternal\"\r\n      formControlName=\"isAllowRecExternal\"\r\n      [label]=\"'department_management.form.isAllowRecExternal'\"\r\n    ></cts-dynamic-form-slide-toggleitem>\r\n  </form>\r\n  <div class=\"button-group d-flex flex-row-reverse\">\r\n    <cts-button\r\n      [theme]=\"'danger'\"\r\n      size=\"'regular'\"\r\n      class=\"voc-form-close\"\r\n      mat-dialog-close\r\n    >\r\n      {{ \"BUTTONS.CLOSE\" | translate }}\r\n    </cts-button>\r\n    <cts-button\r\n      *ngIf=\"!updateMode\"\r\n      [loading]=\"loading\"\r\n      size=\"'regular'\"\r\n      [theme]=\"'primary'\"\r\n      class=\"voc-form-submit\"\r\n      (onClick)=\"save()\"\r\n      [disabled]=\"departmentForm.invalid\"\r\n    >\r\n      {{ \"BUTTONS.SAVE\" | translate }}\r\n    </cts-button>\r\n    <cts-button\r\n      *ngIf=\"updateMode\"\r\n      [loading]=\"loading\"\r\n      size=\"'regular'\"\r\n      [theme]=\"'primary'\"\r\n      class=\"voc-form-submit\"\r\n      (onClick)=\"update()\"\r\n      [disabled]=\"departmentForm.invalid\"\r\n    >\r\n      {{ \"BUTTONS.UPDATE\" | translate }}\r\n    </cts-button>\r\n  </div>\r\n</div>\r\n", styles: [".bi{margin:0!important}.memo-sorting-wrapper{width:265px;margin:0 10px;height:100%;display:flex}.memo-sorting-wrapper .sorting-direction{width:65px;height:40px;background-color:#465573;color:#fff;font-size:20px;display:flex;justify-content:center;align-items:center;cursor:pointer}.memo-sorting-wrapper .memo-sorting-trigger{width:calc(100% - 65px);height:100%;background-color:transparent;border:1px solid lightgrey;display:flex;justify-content:space-between;align-items:center;padding:0 15px;font-size:14px}.memo-sorting-wrapper .memo-sorting-trigger i{font-size:16px;color:gray}.memo-sorting-menu{width:200px}.my-button{border:1px solid #465573;color:#465573;border-radius:5px;background-color:transparent;font-weight:bold;min-width:80px;height:40px}.my-button.reset{border:none}.my-button:hover{color:#fff;background-color:#465573}.my-button:hover.reset{color:#465573;border:1px solid #465573;background-color:#fff}.app-property-value .app-input-wrapper label{color:#646f85;font-size:13px;margin-bottom:5px}.app-property-value .app-input-wrapper label .text-danger{font-size:16px;line-height:14px;margin:0 5px!important}.app-property-value .app-input-wrapper .form-control{border:1px solid #ccc;border-radius:5px;background-color:#8f98aa1a;height:40px}.app-property-value .app-input-wrapper .form-control:disabled{background-color:#e9ecef!important}.app-property-value .app-input-wrapper .form-control:focus{border:1px solid #1a96c6;box-shadow:0 0 4px #79c3c26b!important}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers{list-style:none;padding:0;margin:0;font-size:14px}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers .error{margin-top:5px}.autocomplete-container .input-container input:focus,hijri-gregorian-datepicker .form-group .input-group .form-control:focus,.ng-select.ng-select-focused .ng-select-container{border:1px solid #1a96c6!important;box-shadow:0 0 4px #79c3c26b!important}input::placeholder{font-size:12px}.form-control:focus{box-shadow:none!important}.mat-stepper-horizontal{margin-top:-25px}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header.cdk-program-focused{background-color:transparent}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-icon-selected{background-color:transparent;color:#fff;background-image:linear-gradient(to right,#0dbab5,#1a96c6)}@media only screen and (max-width: 576px){.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-label .mat-step-text-label{white-space:pre-wrap;overflow:visible}}.mat-stepper-horizontal .mat-horizontal-content-container{overflow:visible}@media only screen and (max-width: 768px){.mat-stepper-horizontal .mat-horizontal-content-container{padding:0 0 24px}}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:after,.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:before{display:none}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:before{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);left:0}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:after{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);right:0}.form-wrapper{padding:30px 15px;border:1px solid #dde0e2}.form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.form-wrapper .buttons-wrapper button:hover{opacity:.7}.form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.form-wrapper .upload-wrapper button span{margin:0 10px}.renameFileComponent .form-wrapper{padding:30px 15px;border:none!important}.renameFileComponent .form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.renameFileComponent .form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.renameFileComponent .form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.renameFileComponent .form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.renameFileComponent .form-wrapper .buttons-wrapper button:hover{opacity:.7}.renameFileComponent .form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.renameFileComponent .form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.renameFileComponent .form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.renameFileComponent .form-wrapper .upload-wrapper button span{margin:0 10px}.my-dynamic-viewer{display:flex;align-items:center;font-size:12px;min-height:30px}.my-dynamic-viewer .my-label{font-size:12px;font-weight:500;width:150px;word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-label{width:50%}}.my-dynamic-viewer .my-value{width:calc(100% - 150px);word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-value{width:50%}}.my-dynamic-viewer .direction-img{font-size:14px}.my-dynamic-viewer .direction-img .incoming{display:none}.my-dynamic-viewer .direction-img .outgoing{display:none}.my-dynamic-viewer .direction-img .internal{display:none}.my-dynamic-viewer.draft .my-value{color:#596973}.my-dynamic-viewer.inProgress .my-value{color:#3c3cf0}.my-dynamic-viewer.registered .my-value{color:#4f008c}.my-dynamic-viewer.archived .my-value{color:#fbb62c}.my-dynamic-viewer.closed .my-value{color:#00dca5}.my-dynamic-viewer.approved .my-value{color:#06a57e}.my-dynamic-viewer.assigned .my-value{color:#fd6670}.my-dynamic-viewer.sent .my-value{color:#3c3cf0}.my-dynamic-viewer.published .my-value{color:#00dca5}.my-dynamic-viewer.Outgoing .my-value{display:flex}.my-dynamic-viewer.Outgoing .my-value .direction-img .outgoing{color:#fbb62c;margin:1px 5px;display:flex}.my-dynamic-viewer.Outgoing .my-value .text{margin:0 5px}.my-dynamic-viewer.Internal .my-value{display:flex}.my-dynamic-viewer.Internal .my-value .direction-img .internal{color:#3c3cf0;margin:1px 5px;display:flex}.my-dynamic-viewer.Internal .my-value .text{margin:0 5px}.my-dynamic-viewer.Incoming .my-value{display:flex}.my-dynamic-viewer.Incoming .my-value .direction-img .incoming{color:#00dca5;display:flex}.my-dynamic-viewer.Incoming .my-value .text{margin:-3px 5px 0}.my-dynamic-viewer.vertical{display:block}.my-dynamic-viewer.vertical .my-label{width:auto}.my-dynamic-viewer.vertical .my-value{width:auto}.my-dynamic-viewer.with-out-label{width:100%!important}.voc-form{padding:20px}.voc-form .hint-msg{font-size:12px;font-style:italic;margin-top:2px;color:#6a768e}.voc-form .voc-form-hedaer{margin-bottom:8px;font-size:20px;color:#465573}.voc-form .button-group{margin-top:12px;grid-column-gap:6px!important;column-gap:6px!important}.voc-form .button-group cts-button{width:16%}@media (max-width: 992px){.voc-form .button-group cts-button{width:20%}}@media only screen and (max-width: 768px){.voc-form .button-group cts-button{width:28%}}.voc-form .isAllowRecExternal{display:flex;align-items:center;margin-top:26px;overflow:hidden}@media only screen and (max-width: 768px){.voc-form .isAllowRecExternal{font-size:12px}}\n"], components: [{ type: DynamicFormTextItemComponent, selector: "app-dynamic-form-textitem", inputs: ["autoComplete", "nativeAutoComplete", "autoComplete_pageProvider", "autoComplete_propertyName", "autoComplete_propertyKey", "autoCompleteValueKey", "autoCompleteType", "tenantId", "emitFullObject", "outsideParams", "type", "property", "label", "editable", "placeholder", "disabled", "displayEmpty", "preventSpace", "id", "maxCharsNum"] }, { type: DynamicFormVocabularyItemComponent, selector: "app-dynamic-form-vocabulary-item", inputs: ["bindValue", "bindLabel", "placeholder", "multiple", "searchable", "closeOnSelect", "hideSelectedItems", "disabled", "vocabularyType", "label", "cacheable", "shwoAllValues"], outputs: ["onSelecting"] }, { type: DynamicFormSlideToggleitemComponent, selector: "cts-dynamic-form-slide-toggleitem", inputs: ["label", "disabled", "checked", "theme"], outputs: ["onToggle"] }, { type: ButtonComponent, selector: "cts-button", inputs: ["disabled", "loading", "size", "theme", "spinnerTheming"], outputs: ["onClick"] }], directives: [{ type: SetDirRtlDirective, selector: "[SetDirRtl]" }, { type: i6__namespace.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i6__namespace.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i6__namespace.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i6__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i6__namespace.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i1__namespace$5.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["type", "mat-dialog-close", "aria-label", "matDialogClose"], exportAs: ["matDialogClose"] }, { type: i3__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "translate": i1__namespace$1.TranslatePipe } });
+    DepartmentFormComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.4", type: DepartmentFormComponent, selector: "cts-department-form", ngImport: i0__namespace, template: "<div SetDirRtl class=\"voc-form\">\r\n  <div class=\"voc-form-hedaer\">\r\n    {{\r\n      \"department_management.form.\" + (updateMode ? \"updateHeader\" : \"header\")\r\n        | translate\r\n    }}\r\n  </div>\r\n  <form [formGroup]=\"departmentForm\" class=\"row voc-form-body\">\r\n    <div class=\"col-lg-6 col-12\">\r\n      <app-dynamic-form-textitem\r\n        formControlName=\"title\"\r\n        [label]=\"'department_management.form.title'\"\r\n        [disabled]=\"updateMode\"\r\n        [preventSpace]=\"true\"\r\n      ></app-dynamic-form-textitem>\r\n      <div class=\"hint-msg\">{{ \"department_management.form.hintMsg\" | translate }}</div>\r\n    </div>\r\n    <!-- <app-dynamic-form-textitem\r\n      class=\"col-lg-6 col-12\"\r\n      formControlName=\"agencyCode\"\r\n      [label]=\"'department_management.form.AgencyCode'\"\r\n    ></app-dynamic-form-textitem> -->\r\n    <app-dynamic-form-textitem\r\n      class=\"col-lg-6 col-12\"\r\n      formControlName=\"arabicName\"\r\n      [label]=\"'department_management.form.ArabicName'\"\r\n    ></app-dynamic-form-textitem>\r\n    <app-dynamic-form-textitem\r\n      class=\"col-lg-6 col-12\"\r\n      formControlName=\"englishName\"\r\n      [label]=\"'department_management.form.EnglishName'\"\r\n    ></app-dynamic-form-textitem>\r\n    <app-dynamic-form-vocabulary-item *ngIf=\"data.displayDepTypee\"\r\n      class=\"col-lg-6 col-12\"\r\n      [label]=\"'department_management.form.deptTypee'\"\r\n      [bindLabel]=\"'label'\"\r\n      [bindValue]=\"'id'\"\r\n      placeholder=\"{{ 'VOCABULARY.SELECT_ITEM' | translate }}\"\r\n      [multiple]=\"false\"\r\n      [searchable]=\"false\"\r\n      [closeOnSelect]=\"true\"\r\n      [hideSelectedItems]=\"false\"\r\n      [vocabularyType]=\"'VOC_DepartmentType'\"\r\n      formControlName=\"deptTypee\"\r\n    >\r\n    </app-dynamic-form-vocabulary-item>\r\n    <app-dynamic-form-textitem\r\n      class=\"col-lg-6 col-12\"\r\n      formControlName=\"description\"\r\n      [label]=\"'department_management.form.Description'\"\r\n    ></app-dynamic-form-textitem>\r\n    <!-- <cts-dynamic-form-select-users\r\n      class=\"col-lg-6 col-12\"\r\n      formControlName=\"manager\"\r\n      [bindValue]=\"\"\r\n      [bindLabel]=\"\"\r\n      [label]=\"'department_management.form.Manager'\"\r\n      [deptTitle]=\"'all'\"\r\n      [bindValue]=\"'properties.username'\"\r\n    ></cts-dynamic-form-select-users> -->\r\n\r\n    <cts-dynamic-form-slide-toggleitem *ngIf=\"data.displayIsAllowRecExternal\"\r\n      class=\"col-lg-6 col-12 isAllowRecExternal\"\r\n      formControlName=\"isAllowRecExternal\"\r\n      [label]=\"'department_management.form.isAllowRecExternal'\"\r\n    ></cts-dynamic-form-slide-toggleitem>\r\n  </form>\r\n  <div class=\"button-group d-flex flex-row-reverse\">\r\n    <cts-button\r\n      [theme]=\"'danger'\"\r\n      size=\"'regular'\"\r\n      class=\"voc-form-close\"\r\n      mat-dialog-close\r\n    >\r\n      {{ \"BUTTONS.CLOSE\" | translate }}\r\n    </cts-button>\r\n    <cts-button\r\n      *ngIf=\"!updateMode\"\r\n      [loading]=\"loading\"\r\n      size=\"'regular'\"\r\n      [theme]=\"'primary'\"\r\n      class=\"voc-form-submit\"\r\n      (onClick)=\"save()\"\r\n      [disabled]=\"departmentForm.invalid\"\r\n    >\r\n      {{ \"BUTTONS.SAVE\" | translate }}\r\n    </cts-button>\r\n    <cts-button\r\n      *ngIf=\"updateMode\"\r\n      [loading]=\"loading\"\r\n      size=\"'regular'\"\r\n      [theme]=\"'primary'\"\r\n      class=\"voc-form-submit\"\r\n      (onClick)=\"update()\"\r\n      [disabled]=\"departmentForm.invalid\"\r\n    >\r\n      {{ \"BUTTONS.UPDATE\" | translate }}\r\n    </cts-button>\r\n  </div>\r\n</div>\r\n", styles: [".bi{margin:0!important}.memo-sorting-wrapper{width:265px;margin:0 10px;height:100%;display:flex}.memo-sorting-wrapper .sorting-direction{width:65px;height:40px;background-color:#465573;color:#fff;font-size:20px;display:flex;justify-content:center;align-items:center;cursor:pointer}.memo-sorting-wrapper .memo-sorting-trigger{width:calc(100% - 65px);height:100%;background-color:transparent;border:1px solid lightgrey;display:flex;justify-content:space-between;align-items:center;padding:0 15px;font-size:14px}.memo-sorting-wrapper .memo-sorting-trigger i{font-size:16px;color:gray}.memo-sorting-menu{width:200px}.my-button{border:1px solid #465573;color:#465573;border-radius:5px;background-color:transparent;font-weight:bold;min-width:80px;height:40px}.my-button.reset{border:none}.my-button:hover{color:#fff;background-color:#465573}.my-button:hover.reset{color:#465573;border:1px solid #465573;background-color:#fff}.app-property-value .app-input-wrapper label{color:#646f85;font-size:13px;margin-bottom:5px}.app-property-value .app-input-wrapper label .text-danger{font-size:16px;line-height:14px;margin:0 5px!important}.app-property-value .app-input-wrapper .form-control{border:1px solid #ccc;border-radius:5px;background-color:#8f98aa1a;height:40px}.app-property-value .app-input-wrapper .form-control:disabled{background-color:#e9ecef!important}.app-property-value .app-input-wrapper .form-control:focus{border:1px solid #1a96c6;box-shadow:0 0 4px #79c3c26b!important}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers{list-style:none;padding:0;margin:0;font-size:14px}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers .error{margin-top:5px}.autocomplete-container .input-container input:focus,hijri-gregorian-datepicker .form-group .input-group .form-control:focus,.ng-select.ng-select-focused .ng-select-container{border:1px solid #1a96c6!important;box-shadow:0 0 4px #79c3c26b!important}input::placeholder{font-size:12px}.form-control:focus{box-shadow:none!important}.mat-stepper-horizontal{margin-top:-25px}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header.cdk-program-focused{background-color:transparent}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-icon-selected{background-color:transparent;color:#fff;background-image:linear-gradient(to right,#0dbab5,#1a96c6)}@media only screen and (max-width: 576px){.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-label .mat-step-text-label{white-space:pre-wrap;overflow:visible}}.mat-stepper-horizontal .mat-horizontal-content-container{overflow:visible}@media only screen and (max-width: 768px){.mat-stepper-horizontal .mat-horizontal-content-container{padding:0 0 24px}}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:after,.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:before{display:none}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:before{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);left:0}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:after{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);right:0}.form-wrapper{padding:30px 15px;border:1px solid #dde0e2}.form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.form-wrapper .buttons-wrapper button:hover{opacity:.7}.form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.form-wrapper .upload-wrapper button span{margin:0 10px}.renameFileComponent .form-wrapper{padding:30px 15px;border:none!important}.renameFileComponent .form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.renameFileComponent .form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.renameFileComponent .form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.renameFileComponent .form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.renameFileComponent .form-wrapper .buttons-wrapper button:hover{opacity:.7}.renameFileComponent .form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.renameFileComponent .form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.renameFileComponent .form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.renameFileComponent .form-wrapper .upload-wrapper button span{margin:0 10px}.my-dynamic-viewer{display:flex;align-items:center;font-size:12px;min-height:30px}.my-dynamic-viewer .my-label{font-size:12px;font-weight:500;width:150px;word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-label{width:50%}}.my-dynamic-viewer .my-value{width:calc(100% - 150px);word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-value{width:50%}}.my-dynamic-viewer .direction-img{font-size:14px}.my-dynamic-viewer .direction-img .incoming{display:none}.my-dynamic-viewer .direction-img .outgoing{display:none}.my-dynamic-viewer .direction-img .internal{display:none}.my-dynamic-viewer.draft .my-value{color:#596973}.my-dynamic-viewer.inProgress .my-value{color:#3c3cf0}.my-dynamic-viewer.registered .my-value{color:#4f008c}.my-dynamic-viewer.archived .my-value{color:#fbb62c}.my-dynamic-viewer.closed .my-value{color:#00dca5}.my-dynamic-viewer.approved .my-value{color:#06a57e}.my-dynamic-viewer.assigned .my-value{color:#fd6670}.my-dynamic-viewer.sent .my-value{color:#3c3cf0}.my-dynamic-viewer.published .my-value{color:#00dca5}.my-dynamic-viewer.Outgoing .my-value{display:flex}.my-dynamic-viewer.Outgoing .my-value .direction-img .outgoing{color:#fbb62c;margin:1px 5px;display:flex}.my-dynamic-viewer.Outgoing .my-value .text{margin:0 5px}.my-dynamic-viewer.Internal .my-value{display:flex}.my-dynamic-viewer.Internal .my-value .direction-img .internal{color:#3c3cf0;margin:1px 5px;display:flex}.my-dynamic-viewer.Internal .my-value .text{margin:0 5px}.my-dynamic-viewer.Incoming .my-value{display:flex}.my-dynamic-viewer.Incoming .my-value .direction-img .incoming{color:#00dca5;display:flex}.my-dynamic-viewer.Incoming .my-value .text{margin:-3px 5px 0}.my-dynamic-viewer.vertical{display:block}.my-dynamic-viewer.vertical .my-label{width:auto}.my-dynamic-viewer.vertical .my-value{width:auto}.my-dynamic-viewer.with-out-label{width:100%!important}.voc-form{padding:20px}.voc-form .hint-msg{font-size:12px;font-style:italic;margin-top:2px;color:#6a768e}.voc-form .voc-form-hedaer{margin-bottom:8px;font-size:20px;color:#465573}.voc-form .button-group{margin-top:12px;grid-column-gap:6px!important;column-gap:6px!important}.voc-form .button-group cts-button{width:16%}@media (max-width: 992px){.voc-form .button-group cts-button{width:20%}}@media only screen and (max-width: 768px){.voc-form .button-group cts-button{width:28%}}.voc-form .isAllowRecExternal{display:flex;align-items:center;margin-top:26px;overflow:hidden}@media only screen and (max-width: 768px){.voc-form .isAllowRecExternal{font-size:12px}}\n"], components: [{ type: DynamicFormTextItemComponent, selector: "app-dynamic-form-textitem", inputs: ["autoComplete", "nativeAutoComplete", "autoComplete_pageProvider", "autoComplete_propertyName", "autoComplete_propertyKey", "autoCompleteValueKey", "autoCompleteType", "tenantId", "emitFullObject", "outsideParams", "type", "property", "label", "editable", "placeholder", "disabled", "displayEmpty", "preventSpace", "id", "maxCharsNum"] }, { type: DynamicFormVocabularyItemComponent, selector: "app-dynamic-form-vocabulary-item", inputs: ["bindValue", "bindLabel", "placeholder", "multiple", "searchable", "closeOnSelect", "hideSelectedItems", "disabled", "vocabularyType", "label", "cacheable", "shwoAllValues"], outputs: ["onSelecting"] }, { type: DynamicFormSlideToggleitemComponent, selector: "cts-dynamic-form-slide-toggleitem", inputs: ["label", "disabled", "checked", "theme"], outputs: ["onToggle"] }, { type: ButtonComponent, selector: "cts-button", inputs: ["disabled", "loading", "size", "theme", "spinnerTheming"], outputs: ["onClick"] }], directives: [{ type: SetDirRtlDirective, selector: "[SetDirRtl]" }, { type: i6__namespace.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i6__namespace.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i6__namespace.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i6__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i6__namespace.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i3__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1__namespace$5.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["type", "mat-dialog-close", "aria-label", "matDialogClose"], exportAs: ["matDialogClose"] }], pipes: { "translate": i1__namespace$1.TranslatePipe } });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: DepartmentFormComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -8213,14 +8213,15 @@
                 throw err;
             }));
         };
-        DepartmentManagementService.prototype.openFormDialog = function (e, update, depCode, item) {
+        DepartmentManagementService.prototype.openFormDialog = function (e, update, displayIsAllowRecExternal, displayDepTypee, depCode, item) {
             if (e === void 0) { e = 'root'; }
             if (update === void 0) { update = false; }
             return this.dialog
                 .open(DepartmentFormComponent, {
                 width: '55%',
                 panelClass: 'department-dialog-container',
-                data: { depId: e, updateMode: update, depCode: depCode, item: item },
+                data: { depId: e, updateMode: update, depCode: depCode, item: item, displayDepTypee: displayDepTypee,
+                    displayIsAllowRecExternal: displayIsAllowRecExternal },
                 disableClose: true
             })
                 .afterClosed()
@@ -8450,7 +8451,7 @@
                     }
                     else {
                         this.departmentManagment
-                            .openFormDialog(item.value.uid, false, item.value.title, item)
+                            .openFormDialog(item.value.uid, false, this.displayIsAllowRecExternal, this.displayDepTypee, item.value.title, item)
                             .subscribe(function (res) {
                             if (res) {
                                 _this.update(item);
@@ -8468,7 +8469,7 @@
                     }
                     else {
                         this.departmentManagment
-                            .openFormDialog(item.value.uid, true)
+                            .openFormDialog(item.value.uid, true, this.displayIsAllowRecExternal, this.displayDepTypee)
                             .subscribe(function (res) {
                             // this.update(item);
                             _this.departmentApiService.getDepartmentTree().subscribe(function (res) {
@@ -8509,7 +8510,7 @@
         return TreeviewSelectComponent;
     }());
     TreeviewSelectComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: TreeviewSelectComponent, deps: [{ token: i1__namespace$2.TreeviewI18n }, { token: TranslationService$1 }, { token: DepartmentApiService }, { token: DepartmentManagementService$1 }, { token: RolesService$1 }, { token: NuxeoService$1 }, { token: GlobalAdminService }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    TreeviewSelectComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.4", type: TreeviewSelectComponent, selector: "app-dynamic-form-treeview-select", inputs: { treeview: "treeview", treeViewAsFormControl: "treeViewAsFormControl", config: "config", items: "items", value: "value", multiple: "multiple", defaultSelect: "defaultSelect", pp_departmentNestedTree: "pp_departmentNestedTree", useCustomAddEditAction: "useCustomAddEditAction", customPrefix: "customPrefix", customParentProperty: "customParentProperty", placeholder: "placeholder" }, outputs: { valueChange: "valueChange", plusClicked: "plusClicked", actionClicked: "actionClicked" }, providers: [{ provide: i1$2.TreeviewI18n, useClass: DropdownTreeviewSelectI18n }], viewQueries: [{ propertyName: "dropdownTreeviewComponent", first: true, predicate: i1$2.DropdownTreeviewComponent, descendants: true }], usesOnChanges: true, ngImport: i0__namespace, template: "<ng-template\r\n  #itemTemplate\r\n  let-item=\"item\"\r\n  let-onCollapseExpand=\"onCollapseExpand\"\r\n  let-onCheckedChange=\"onCheckedChange\"\r\n>\r\n  <!-- single -->\r\n  <div *ngIf=\"!treeview && !multiple\">\r\n    <div\r\n      class=\"text-nowrap row-item\"\r\n      [ngClass]=\"{ active: item.value === this.value }\"\r\n    >\r\n      <i\r\n        *ngIf=\"item.children\"\r\n        (click)=\"onCollapseExpand()\"\r\n        aria-hidden=\"true\"\r\n        [ngSwitch]=\"item.collapsed\"\r\n      >\r\n        <span\r\n          *ngSwitchCase=\"true\"\r\n          class=\"bi bi-caret-{{ arabic ? 'left' : 'right' }}-fill caret-icon\"\r\n        ></span>\r\n        <span\r\n          *ngSwitchCase=\"false\"\r\n          class=\"bi bi-caret-down-fill caret-icon\"\r\n        ></span>\r\n      </i>\r\n      <!-- <label class=\"form-check-label\" (click)=\"select(item)\">{{\r\n        item.text\r\n      }}</label> -->\r\n      <label *ngIf=\"item.disabled\" class=\"form-check-label\">{{\r\n        item.text\r\n      }}</label>\r\n      <label *ngIf=\"!item.disabled\" class=\"form-check-label\" (click)=\"select(item)\">{{\r\n        item.text\r\n      }}</label>\r\n    </div>\r\n  </div>\r\n  <!-- Multiple -->\r\n  <div *ngIf=\"!treeview && multiple\">\r\n    <div\r\n      class=\"text-nowrap row-item\"\r\n      [ngClass]=\"{ active: item.value === this.value }\"\r\n    >\r\n      <i\r\n        *ngIf=\"item.children\"\r\n        (click)=\"onCollapseExpand()\"\r\n        aria-hidden=\"true\"\r\n        [ngSwitch]=\"item.collapsed\"\r\n      >\r\n        <span\r\n          *ngSwitchCase=\"true\"\r\n          class=\"bi bi-caret-{{ arabic ? 'left' : 'right' }}-fill caret-icon\"\r\n        ></span>\r\n        <span\r\n          *ngSwitchCase=\"false\"\r\n          class=\"bi bi-caret-down-fill caret-icon\"\r\n        ></span>\r\n      </i>\r\n      <!-- <input\r\n        class=\"multiple-checkBox\"\r\n        type=\"checkbox\"\r\n        [checked]=\"multipleSelection.includes(item.value)\"\r\n        (change)=\"selectMultiple($event.target.checked, item)\"\r\n      />\r\n\r\n      <label class=\"form-check-label\">{{ item.text }}</label> -->\r\n      <div class=\"multiple-treeview\">\r\n        <mat-checkbox\r\n          [checked]=\"multipleSelection.includes(item.value)\"\r\n          (change)=\"selectMultiple($event.checked, item)\"\r\n        >\r\n          <span> {{ item.text }} </span>\r\n        </mat-checkbox>\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <!-- treeView -->\r\n  <div *ngIf=\"treeview && !treeViewAsFormControl\" class=\"tree-view-container\">\r\n    <div\r\n      (mouseenter)=\"hoverField.style.display = 'flex'\"\r\n      (mouseleave)=\"hoverField.style.display = 'none'\"\r\n      class=\"text-nowrap row-item treeview-row\"\r\n      [ngClass]=\"{ selected: item.value == selectedItem }\"\r\n    >\r\n      <i\r\n        *ngIf=\"item.children\"\r\n        (click)=\"onCollapsed(item)\"\r\n        aria-hidden=\"true\"\r\n        [ngSwitch]=\"item.collapsed\"\r\n      >\r\n        <span\r\n          *ngSwitchCase=\"true\"\r\n          class=\"bi bi-caret-{{ arabic ? 'left' : 'right' }}-fill caret-icon\"\r\n        ></span>\r\n\r\n        <span\r\n          *ngSwitchCase=\"false\"\r\n          class=\"bi bi-caret-down-fill caret-icon\"\r\n        ></span>\r\n      </i>\r\n      <label class=\"form-check-label-treeview\" (click)=\"select(item)\"\r\n        >{{ item.text }}\r\n        <span #hoverField class=\"hoverField\">\r\n          <span\r\n            type=\"button\"\r\n            matTooltip=\"{{ 'department_management.form.edit' | translate }}\"\r\n            (click)=\"onAction($event, 'update', item)\"\r\n          >\r\n            <li class=\"bi bi-pencil\"></li>\r\n          </span>\r\n\r\n          <span\r\n            type=\"button\"\r\n            matTooltip=\"{{\r\n              'department_management.form.toolTip_message' | translate\r\n            }}\"\r\n            (click)=\"onAction($event, 'add', item)\"\r\n          >\r\n            <li class=\"bi bi-plus\"></li>\r\n          </span>\r\n        </span>\r\n      </label>\r\n    </div>\r\n  </div>\r\n    <!-- treeView as form control -->\r\n    <div *ngIf=\"treeview && treeViewAsFormControl\" class=\"tree-view-container\">\r\n      <div\r\n        class=\"text-nowrap row-item treeview-row-form-control\"\r\n        [ngClass]=\"{ 'selected-form-control': item.value == selectedItem }\"\r\n      >\r\n        <i\r\n          *ngIf=\"item.children\"\r\n          (click)=\"onCollapsed(item)\"\r\n          aria-hidden=\"true\"\r\n          [ngSwitch]=\"item.collapsed\"\r\n        >\r\n          <span\r\n            *ngSwitchCase=\"true\"\r\n            class=\"bi bi-caret-{{ arabic ? 'left' : 'right' }}-fill caret-icon\"\r\n          ></span>\r\n  \r\n          <span\r\n            *ngSwitchCase=\"false\"\r\n            class=\"bi bi-caret-down-fill caret-icon\"\r\n          ></span>\r\n        </i>\r\n        <label class=\"form-check-label-treeview\" (click)=\"select(item)\"\r\n          >{{ item.text }}\r\n        </label>\r\n      </div>\r\n    </div>\r\n</ng-template>\r\n<ng-template\r\n  #headerTemplate\r\n  let-config=\"config\"\r\n  let-item=\"item\"\r\n  let-onCollapseExpand=\"onCollapseExpand\"\r\n  let-onCheckedChange=\"onCheckedChange\"\r\n  let-onFilterTextChange=\"onFilterTextChange\"\r\n>\r\n  <div *ngIf=\"config.hasFilter\" class=\"row row-filter\">\r\n    <div class=\"col-12\">\r\n      <input\r\n        class=\"form-control\"\r\n        type=\"text\"\r\n        [placeholder]=\"i18n.getFilterPlaceholder(placeholder)\"\r\n        [(ngModel)]=\"filterText\"\r\n        (ngModelChange)=\"onFilterTextChange($event)\"\r\n      />\r\n    </div>\r\n  </div>\r\n  <div *ngIf=\"config.hasAllCheckBox || config.hasCollapseExpand\" class=\"row\">\r\n    <div class=\"col-12\">\r\n      <label *ngIf=\"config.hasAllCheckBox\" (click)=\"select(item)\">\r\n        <strong>{{ i18n.getAllCheckboxText() }}</strong>\r\n      </label>\r\n      <label\r\n        *ngIf=\"config.hasCollapseExpand\"\r\n        class=\"float-right\"\r\n        (click)=\"onCollapseExpand()\"\r\n      >\r\n        <i\r\n          [title]=\"i18n.getTooltipCollapseExpandText(item.collapsed)\"\r\n          aria-hidden=\"true\"\r\n          [ngSwitch]=\"item.collapsed\"\r\n        >\r\n          <span *ngSwitchCase=\"true\" class=\"bi bi-arrows-angle-expand\"></span>\r\n          <span\r\n            *ngSwitchCase=\"false\"\r\n            class=\"bi bi-arrows-angle-contract\"\r\n          ></span>\r\n        </i>\r\n      </label>\r\n    </div>\r\n  </div>\r\n  <a *ngIf=\"defaultSelect\" class=\"select-default\" (click)=\"selectDefault()\">{{'department_management.selectDefault'| translate}}</a>\r\n  <div *ngIf=\"config.hasDivider\" class=\"dropdown-divider\" [ngClass]=\"{'dropdown-divider-noMargin': defaultSelect}\"></div>\r\n</ng-template>\r\n\r\n<ng-container *ngIf=\"!treeview && !multiple\">\r\n  <ngx-dropdown-treeview\r\n    [config]=\"config\"\r\n    [headerTemplate]=\"headerTemplate\"\r\n    [items]=\"items\"\r\n    [itemTemplate]=\"itemTemplate\"\r\n  >\r\n  </ngx-dropdown-treeview\r\n></ng-container>\r\n<ng-container *ngIf=\"!treeview && multiple\">\r\n  <div class=\"multiple-tree-view\">\r\n    <ngx-dropdown-treeview\r\n      [config]=\"config\"\r\n      [items]=\"items\"\r\n      [itemTemplate]=\"itemTemplate\"\r\n    >\r\n    </ngx-dropdown-treeview>\r\n  </div>\r\n</ng-container>\r\n<ng-container *ngIf=\"treeview && !treeViewAsFormControl\">\r\n  <div class=\"tree-view\">\r\n    <ngx-treeview\r\n      [config]=\"config\"\r\n      [headerTemplate]=\"headerTemplate\"\r\n      [items]=\"items\"\r\n      [itemTemplate]=\"itemTemplate\"\r\n    >\r\n    </ngx-treeview>\r\n  </div>\r\n</ng-container>\r\n<ng-container *ngIf=\"treeview && treeViewAsFormControl\">\r\n  <div class=\"tree-view-form-control\">\r\n    <ngx-treeview\r\n      [config]=\"config\"\r\n      [headerTemplate]=\"headerTemplate\"\r\n      [items]=\"items\"\r\n      [itemTemplate]=\"itemTemplate\"\r\n    >\r\n    </ngx-treeview>\r\n  </div>\r\n</ng-container>\r\n", styles: [".bi{margin:0!important}.memo-sorting-wrapper{width:265px;margin:0 10px;height:100%;display:flex}.memo-sorting-wrapper .sorting-direction{width:65px;height:40px;background-color:#465573;color:#fff;font-size:20px;display:flex;justify-content:center;align-items:center;cursor:pointer}.memo-sorting-wrapper .memo-sorting-trigger{width:calc(100% - 65px);height:100%;background-color:transparent;border:1px solid lightgrey;display:flex;justify-content:space-between;align-items:center;padding:0 15px;font-size:14px}.memo-sorting-wrapper .memo-sorting-trigger i{font-size:16px;color:gray}.memo-sorting-menu{width:200px}.my-button{border:1px solid #465573;color:#465573;border-radius:5px;background-color:transparent;font-weight:bold;min-width:80px;height:40px}.my-button.reset{border:none}.my-button:hover{color:#fff;background-color:#465573}.my-button:hover.reset{color:#465573;border:1px solid #465573;background-color:#fff}.app-property-value .app-input-wrapper label{color:#646f85;font-size:13px;margin-bottom:5px}.app-property-value .app-input-wrapper label .text-danger{font-size:16px;line-height:14px;margin:0 5px!important}.app-property-value .app-input-wrapper .form-control{border:1px solid #ccc;border-radius:5px;background-color:#8f98aa1a;height:40px}.app-property-value .app-input-wrapper .form-control:disabled{background-color:#e9ecef!important}.app-property-value .app-input-wrapper .form-control:focus{border:1px solid #1a96c6;box-shadow:0 0 4px #79c3c26b!important}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers{list-style:none;padding:0;margin:0;font-size:14px}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers .error{margin-top:5px}.autocomplete-container .input-container input:focus,hijri-gregorian-datepicker .form-group .input-group .form-control:focus,.ng-select.ng-select-focused .ng-select-container{border:1px solid #1a96c6!important;box-shadow:0 0 4px #79c3c26b!important}input::placeholder{font-size:12px}.form-control:focus{box-shadow:none!important}.mat-stepper-horizontal{margin-top:-25px}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header.cdk-program-focused{background-color:transparent}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-icon-selected{background-color:transparent;color:#fff;background-image:linear-gradient(to right,#0dbab5,#1a96c6)}@media only screen and (max-width: 576px){.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-label .mat-step-text-label{white-space:pre-wrap;overflow:visible}}.mat-stepper-horizontal .mat-horizontal-content-container{overflow:visible}@media only screen and (max-width: 768px){.mat-stepper-horizontal .mat-horizontal-content-container{padding:0 0 24px}}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:after,.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:before{display:none}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:before{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);left:0}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:after{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);right:0}.form-wrapper{padding:30px 15px;border:1px solid #dde0e2}.form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.form-wrapper .buttons-wrapper button:hover{opacity:.7}.form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.form-wrapper .upload-wrapper button span{margin:0 10px}.renameFileComponent .form-wrapper{padding:30px 15px;border:none!important}.renameFileComponent .form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.renameFileComponent .form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.renameFileComponent .form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.renameFileComponent .form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.renameFileComponent .form-wrapper .buttons-wrapper button:hover{opacity:.7}.renameFileComponent .form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.renameFileComponent .form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.renameFileComponent .form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.renameFileComponent .form-wrapper .upload-wrapper button span{margin:0 10px}.my-dynamic-viewer{display:flex;align-items:center;font-size:12px;min-height:30px}.my-dynamic-viewer .my-label{font-size:12px;font-weight:500;width:150px;word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-label{width:50%}}.my-dynamic-viewer .my-value{width:calc(100% - 150px);word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-value{width:50%}}.my-dynamic-viewer .direction-img{font-size:14px}.my-dynamic-viewer .direction-img .incoming{display:none}.my-dynamic-viewer .direction-img .outgoing{display:none}.my-dynamic-viewer .direction-img .internal{display:none}.my-dynamic-viewer.draft .my-value{color:#596973}.my-dynamic-viewer.inProgress .my-value{color:#3c3cf0}.my-dynamic-viewer.registered .my-value{color:#4f008c}.my-dynamic-viewer.archived .my-value{color:#fbb62c}.my-dynamic-viewer.closed .my-value{color:#00dca5}.my-dynamic-viewer.approved .my-value{color:#06a57e}.my-dynamic-viewer.assigned .my-value{color:#fd6670}.my-dynamic-viewer.sent .my-value{color:#3c3cf0}.my-dynamic-viewer.published .my-value{color:#00dca5}.my-dynamic-viewer.Outgoing .my-value{display:flex}.my-dynamic-viewer.Outgoing .my-value .direction-img .outgoing{color:#fbb62c;margin:1px 5px;display:flex}.my-dynamic-viewer.Outgoing .my-value .text{margin:0 5px}.my-dynamic-viewer.Internal .my-value{display:flex}.my-dynamic-viewer.Internal .my-value .direction-img .internal{color:#3c3cf0;margin:1px 5px;display:flex}.my-dynamic-viewer.Internal .my-value .text{margin:0 5px}.my-dynamic-viewer.Incoming .my-value{display:flex}.my-dynamic-viewer.Incoming .my-value .direction-img .incoming{color:#00dca5;display:flex}.my-dynamic-viewer.Incoming .my-value .text{margin:-3px 5px 0}.my-dynamic-viewer.vertical{display:block}.my-dynamic-viewer.vertical .my-label{width:auto}.my-dynamic-viewer.vertical .my-value{width:auto}.my-dynamic-viewer.with-out-label{width:100%!important}.caret-icon{color:#6c757d;font-size:14px}.multiple-treeview .mat-checkbox-ripple .mat-ripple-element,.multiple-treeview .mat-checkbox-checked.mat-accent .mat-checkbox-background{background-color:#33e3b7!important}.multiple-treeview .mat-checkbox-ripple .mat-ripple-element{position:fixed;left:inherit;top:inherit;transform:translate(-3px,-3px)!important}.multiple-treeview mat-checkbox .mat-checkbox-background{background-color:#d9dce2!important}.form-check-label-treeview{display:flex;align-items:center;justify-content:space-between;width:100%}.form-check-label-treeview .hoverField{display:none;align-items:center;text-align:center}.form-check-label-treeview .hoverField span{display:flex;align-items:center;justify-content:center;margin:0 3px;border:none;background-color:snow;background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:30px;width:30px;color:#fff;border-radius:5px;list-style:none;margin-inline-end:4px}.form-check-label-treeview .hoverField span .bi-plus{font-size:28px;display:flex;justify-content:center}.form-check-label-treeview .hoverField .add-btn{width:164px;padding:1px;display:flex;justify-content:center;align-items:center;font-size:13px;background-color:#0dbab5;border-radius:5px;border:0;color:#fff;--tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, .1), 0 1px 2px 0 rgba(0, 0, 0, .06);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.form-check-label-treeview .hoverField .plus-btn{display:flex;font-size:28px;align-items:center}.selected{background-color:#f5f6f8}.selected .hoverField{display:flex!important}.selected-form-control{background-color:#d9dce2}.selected-form-control .hoverField{display:flex!important}.treeview-item .row-item{display:flex;align-items:center;padding:5px 10px}.treeview-item .row-item .multiple-checkBox{margin-inline-start:4px;margin-inline-end:4px}.treeview-item .active{background-color:#f5f6f8}.treeview-row{display:flex;align-items:center}.treeview-row:hover{background-color:#f5f6f8}.treeview-row-form-control{display:flex;align-items:center}.treeview-row-form-control:hover{background-color:#d9dce2}label{margin-bottom:0;cursor:pointer}.bi{cursor:pointer;margin-right:.3rem}ngx-treeview .treeview-container{max-height:200px!important;overflow-x:hidden;scrollbar-color:#b4bac6 transparent!important;scrollbar-width:thin!important;overflow-y:auto}ngx-treeview .select-default{display:flex;justify-content:start;font-size:13px;cursor:pointer;margin-bottom:3px;margin-top:4px}ngx-treeview .dropdown-divider-noMargin{margin-top:0!important}.tree-view ngx-treeview .treeview-container{max-height:500px!important;overflow-x:hidden}.tree-view-form-control ngx-treeview .treeview-container{max-height:300px!important;overflow-x:hidden}ngx-dropdown-treeview .dropdown .dropdown-menu{margin-top:0!important;width:100%}ngx-dropdown-treeview .dropdown .btn-outline-secondary{background-color:#8f98aa1a;border:none!important}ngx-dropdown-treeview .dropdown .btn-outline-secondary:hover{color:#6c757d!important}ngx-dropdown-treeview .dropdown .btn-outline-secondary:focus{box-shadow:none!important}ngx-dropdown-treeview .dropdown .btn-outline-secondary:active{background-color:#8f98aa1a!important;border:none!important;color:#6c757d!important}ngx-dropdown-treeview .dropdown:after{position:static!important}ngx-dropdown-treeview .show .dropdown-toggle{background-color:#8f98aa1a!important;border:none!important;color:#6c757d!important}.rtl .treeview-item .treeview-item{margin-right:2rem!important;margin-left:0!important}.rtl .row-all .col-12{text-align:right}.rtl .row-all .col-12 .pull-right{float:left!important}.rtl .form-check.form-check-inline{margin-right:0!important}.rtl .btn.dropdown-toggle{margin-right:0!important}.rtl .dropdown-menu:not(ngb-datepicker){right:0px;left:unset}.rtl .dropdown :after{margin-top:.6rem;left:.6rem;right:unset!important}.rtl ngx-treeview-item{text-align:right;direction:rtl}@media (min-width: 576px){.rtl .form-inline .form-check-input{margin:3px}}.rtl .form-inline .form-check-input{margin:3px;position:inherit}.rtl .dropdown button{text-align:right!important;direction:rtl}.rtl .fa.fa-caret-right{transform:rotate(180deg)}\n"], components: [{ type: i7__namespace.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "id", "labelPosition", "name", "required", "checked", "disabled", "indeterminate", "aria-describedby", "value"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: i1__namespace$2.DropdownTreeviewComponent, selector: "ngx-dropdown-treeview", inputs: ["buttonClass", "config", "headerTemplate", "itemTemplate", "items"], outputs: ["selectedChange", "filterChange"] }, { type: i1__namespace$2.TreeviewComponent, selector: "ngx-treeview", inputs: ["config", "headerTemplate", "itemTemplate", "items"], outputs: ["selectedChange", "filterChange"] }], directives: [{ type: i3__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3__namespace$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3__namespace$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i8__namespace$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltipPosition", "matTooltipDisabled", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { type: i6__namespace.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i6__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i6__namespace.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "translate": i1__namespace$1.TranslatePipe }, encapsulation: i0__namespace.ViewEncapsulation.None });
+    TreeviewSelectComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.4", type: TreeviewSelectComponent, selector: "app-dynamic-form-treeview-select", inputs: { treeview: "treeview", treeViewAsFormControl: "treeViewAsFormControl", config: "config", items: "items", value: "value", multiple: "multiple", defaultSelect: "defaultSelect", pp_departmentNestedTree: "pp_departmentNestedTree", useCustomAddEditAction: "useCustomAddEditAction", customPrefix: "customPrefix", customParentProperty: "customParentProperty", placeholder: "placeholder", displayDepTypee: "displayDepTypee", displayIsAllowRecExternal: "displayIsAllowRecExternal" }, outputs: { valueChange: "valueChange", plusClicked: "plusClicked", actionClicked: "actionClicked" }, providers: [{ provide: i1$2.TreeviewI18n, useClass: DropdownTreeviewSelectI18n }], viewQueries: [{ propertyName: "dropdownTreeviewComponent", first: true, predicate: i1$2.DropdownTreeviewComponent, descendants: true }], usesOnChanges: true, ngImport: i0__namespace, template: "<ng-template\r\n  #itemTemplate\r\n  let-item=\"item\"\r\n  let-onCollapseExpand=\"onCollapseExpand\"\r\n  let-onCheckedChange=\"onCheckedChange\"\r\n>\r\n  <!-- single -->\r\n  <div *ngIf=\"!treeview && !multiple\">\r\n    <div\r\n      class=\"text-nowrap row-item\"\r\n      [ngClass]=\"{ active: item.value === this.value }\"\r\n    >\r\n      <i\r\n        *ngIf=\"item.children\"\r\n        (click)=\"onCollapseExpand()\"\r\n        aria-hidden=\"true\"\r\n        [ngSwitch]=\"item.collapsed\"\r\n      >\r\n        <span\r\n          *ngSwitchCase=\"true\"\r\n          class=\"bi bi-caret-{{ arabic ? 'left' : 'right' }}-fill caret-icon\"\r\n        ></span>\r\n        <span\r\n          *ngSwitchCase=\"false\"\r\n          class=\"bi bi-caret-down-fill caret-icon\"\r\n        ></span>\r\n      </i>\r\n      <!-- <label class=\"form-check-label\" (click)=\"select(item)\">{{\r\n        item.text\r\n      }}</label> -->\r\n      <label *ngIf=\"item.disabled\" class=\"form-check-label\">{{\r\n        item.text\r\n      }}</label>\r\n      <label *ngIf=\"!item.disabled\" class=\"form-check-label\" (click)=\"select(item)\">{{\r\n        item.text\r\n      }}</label>\r\n    </div>\r\n  </div>\r\n  <!-- Multiple -->\r\n  <div *ngIf=\"!treeview && multiple\">\r\n    <div\r\n      class=\"text-nowrap row-item\"\r\n      [ngClass]=\"{ active: item.value === this.value }\"\r\n    >\r\n      <i\r\n        *ngIf=\"item.children\"\r\n        (click)=\"onCollapseExpand()\"\r\n        aria-hidden=\"true\"\r\n        [ngSwitch]=\"item.collapsed\"\r\n      >\r\n        <span\r\n          *ngSwitchCase=\"true\"\r\n          class=\"bi bi-caret-{{ arabic ? 'left' : 'right' }}-fill caret-icon\"\r\n        ></span>\r\n        <span\r\n          *ngSwitchCase=\"false\"\r\n          class=\"bi bi-caret-down-fill caret-icon\"\r\n        ></span>\r\n      </i>\r\n      <!-- <input\r\n        class=\"multiple-checkBox\"\r\n        type=\"checkbox\"\r\n        [checked]=\"multipleSelection.includes(item.value)\"\r\n        (change)=\"selectMultiple($event.target.checked, item)\"\r\n      />\r\n\r\n      <label class=\"form-check-label\">{{ item.text }}</label> -->\r\n      <div class=\"multiple-treeview\">\r\n        <mat-checkbox\r\n          [checked]=\"multipleSelection.includes(item.value)\"\r\n          (change)=\"selectMultiple($event.checked, item)\"\r\n        >\r\n          <span> {{ item.text }} </span>\r\n        </mat-checkbox>\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <!-- treeView -->\r\n  <div *ngIf=\"treeview && !treeViewAsFormControl\" class=\"tree-view-container\">\r\n    <div\r\n      (mouseenter)=\"hoverField.style.display = 'flex'\"\r\n      (mouseleave)=\"hoverField.style.display = 'none'\"\r\n      class=\"text-nowrap row-item treeview-row\"\r\n      [ngClass]=\"{ selected: item.value == selectedItem }\"\r\n    >\r\n      <i\r\n        *ngIf=\"item.children\"\r\n        (click)=\"onCollapsed(item)\"\r\n        aria-hidden=\"true\"\r\n        [ngSwitch]=\"item.collapsed\"\r\n      >\r\n        <span\r\n          *ngSwitchCase=\"true\"\r\n          class=\"bi bi-caret-{{ arabic ? 'left' : 'right' }}-fill caret-icon\"\r\n        ></span>\r\n\r\n        <span\r\n          *ngSwitchCase=\"false\"\r\n          class=\"bi bi-caret-down-fill caret-icon\"\r\n        ></span>\r\n      </i>\r\n      <label class=\"form-check-label-treeview\" (click)=\"select(item)\"\r\n        >{{ item.text }}\r\n        <span #hoverField class=\"hoverField\">\r\n          <span\r\n            type=\"button\"\r\n            matTooltip=\"{{ 'department_management.form.edit' | translate }}\"\r\n            (click)=\"onAction($event, 'update', item)\"\r\n          >\r\n            <li class=\"bi bi-pencil\"></li>\r\n          </span>\r\n\r\n          <span\r\n            type=\"button\"\r\n            matTooltip=\"{{\r\n              'department_management.form.toolTip_message' | translate\r\n            }}\"\r\n            (click)=\"onAction($event, 'add', item)\"\r\n          >\r\n            <li class=\"bi bi-plus\"></li>\r\n          </span>\r\n        </span>\r\n      </label>\r\n    </div>\r\n  </div>\r\n    <!-- treeView as form control -->\r\n    <div *ngIf=\"treeview && treeViewAsFormControl\" class=\"tree-view-container\">\r\n      <div\r\n        class=\"text-nowrap row-item treeview-row-form-control\"\r\n        [ngClass]=\"{ 'selected-form-control': item.value == selectedItem }\"\r\n      >\r\n        <i\r\n          *ngIf=\"item.children\"\r\n          (click)=\"onCollapsed(item)\"\r\n          aria-hidden=\"true\"\r\n          [ngSwitch]=\"item.collapsed\"\r\n        >\r\n          <span\r\n            *ngSwitchCase=\"true\"\r\n            class=\"bi bi-caret-{{ arabic ? 'left' : 'right' }}-fill caret-icon\"\r\n          ></span>\r\n  \r\n          <span\r\n            *ngSwitchCase=\"false\"\r\n            class=\"bi bi-caret-down-fill caret-icon\"\r\n          ></span>\r\n        </i>\r\n        <label class=\"form-check-label-treeview\" (click)=\"select(item)\"\r\n          >{{ item.text }}\r\n        </label>\r\n      </div>\r\n    </div>\r\n</ng-template>\r\n<ng-template\r\n  #headerTemplate\r\n  let-config=\"config\"\r\n  let-item=\"item\"\r\n  let-onCollapseExpand=\"onCollapseExpand\"\r\n  let-onCheckedChange=\"onCheckedChange\"\r\n  let-onFilterTextChange=\"onFilterTextChange\"\r\n>\r\n  <div *ngIf=\"config.hasFilter\" class=\"row row-filter\">\r\n    <div class=\"col-12\">\r\n      <input\r\n        class=\"form-control\"\r\n        type=\"text\"\r\n        [placeholder]=\"i18n.getFilterPlaceholder(placeholder)\"\r\n        [(ngModel)]=\"filterText\"\r\n        (ngModelChange)=\"onFilterTextChange($event)\"\r\n      />\r\n    </div>\r\n  </div>\r\n  <div *ngIf=\"config.hasAllCheckBox || config.hasCollapseExpand\" class=\"row\">\r\n    <div class=\"col-12\">\r\n      <label *ngIf=\"config.hasAllCheckBox\" (click)=\"select(item)\">\r\n        <strong>{{ i18n.getAllCheckboxText() }}</strong>\r\n      </label>\r\n      <label\r\n        *ngIf=\"config.hasCollapseExpand\"\r\n        class=\"float-right\"\r\n        (click)=\"onCollapseExpand()\"\r\n      >\r\n        <i\r\n          [title]=\"i18n.getTooltipCollapseExpandText(item.collapsed)\"\r\n          aria-hidden=\"true\"\r\n          [ngSwitch]=\"item.collapsed\"\r\n        >\r\n          <span *ngSwitchCase=\"true\" class=\"bi bi-arrows-angle-expand\"></span>\r\n          <span\r\n            *ngSwitchCase=\"false\"\r\n            class=\"bi bi-arrows-angle-contract\"\r\n          ></span>\r\n        </i>\r\n      </label>\r\n    </div>\r\n  </div>\r\n  <a *ngIf=\"defaultSelect\" class=\"select-default\" (click)=\"selectDefault()\">{{'department_management.selectDefault'| translate}}</a>\r\n  <div *ngIf=\"config.hasDivider\" class=\"dropdown-divider\" [ngClass]=\"{'dropdown-divider-noMargin': defaultSelect}\"></div>\r\n</ng-template>\r\n\r\n<ng-container *ngIf=\"!treeview && !multiple\">\r\n  <ngx-dropdown-treeview\r\n    [config]=\"config\"\r\n    [headerTemplate]=\"headerTemplate\"\r\n    [items]=\"items\"\r\n    [itemTemplate]=\"itemTemplate\"\r\n  >\r\n  </ngx-dropdown-treeview\r\n></ng-container>\r\n<ng-container *ngIf=\"!treeview && multiple\">\r\n  <div class=\"multiple-tree-view\">\r\n    <ngx-dropdown-treeview\r\n      [config]=\"config\"\r\n      [items]=\"items\"\r\n      [itemTemplate]=\"itemTemplate\"\r\n    >\r\n    </ngx-dropdown-treeview>\r\n  </div>\r\n</ng-container>\r\n<ng-container *ngIf=\"treeview && !treeViewAsFormControl\">\r\n  <div class=\"tree-view\">\r\n    <ngx-treeview\r\n      [config]=\"config\"\r\n      [headerTemplate]=\"headerTemplate\"\r\n      [items]=\"items\"\r\n      [itemTemplate]=\"itemTemplate\"\r\n    >\r\n    </ngx-treeview>\r\n  </div>\r\n</ng-container>\r\n<ng-container *ngIf=\"treeview && treeViewAsFormControl\">\r\n  <div class=\"tree-view-form-control\">\r\n    <ngx-treeview\r\n      [config]=\"config\"\r\n      [headerTemplate]=\"headerTemplate\"\r\n      [items]=\"items\"\r\n      [itemTemplate]=\"itemTemplate\"\r\n    >\r\n    </ngx-treeview>\r\n  </div>\r\n</ng-container>\r\n", styles: [".bi{margin:0!important}.memo-sorting-wrapper{width:265px;margin:0 10px;height:100%;display:flex}.memo-sorting-wrapper .sorting-direction{width:65px;height:40px;background-color:#465573;color:#fff;font-size:20px;display:flex;justify-content:center;align-items:center;cursor:pointer}.memo-sorting-wrapper .memo-sorting-trigger{width:calc(100% - 65px);height:100%;background-color:transparent;border:1px solid lightgrey;display:flex;justify-content:space-between;align-items:center;padding:0 15px;font-size:14px}.memo-sorting-wrapper .memo-sorting-trigger i{font-size:16px;color:gray}.memo-sorting-menu{width:200px}.my-button{border:1px solid #465573;color:#465573;border-radius:5px;background-color:transparent;font-weight:bold;min-width:80px;height:40px}.my-button.reset{border:none}.my-button:hover{color:#fff;background-color:#465573}.my-button:hover.reset{color:#465573;border:1px solid #465573;background-color:#fff}.app-property-value .app-input-wrapper label{color:#646f85;font-size:13px;margin-bottom:5px}.app-property-value .app-input-wrapper label .text-danger{font-size:16px;line-height:14px;margin:0 5px!important}.app-property-value .app-input-wrapper .form-control{border:1px solid #ccc;border-radius:5px;background-color:#8f98aa1a;height:40px}.app-property-value .app-input-wrapper .form-control:disabled{background-color:#e9ecef!important}.app-property-value .app-input-wrapper .form-control:focus{border:1px solid #1a96c6;box-shadow:0 0 4px #79c3c26b!important}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers{list-style:none;padding:0;margin:0;font-size:14px}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers .error{margin-top:5px}.autocomplete-container .input-container input:focus,hijri-gregorian-datepicker .form-group .input-group .form-control:focus,.ng-select.ng-select-focused .ng-select-container{border:1px solid #1a96c6!important;box-shadow:0 0 4px #79c3c26b!important}input::placeholder{font-size:12px}.form-control:focus{box-shadow:none!important}.mat-stepper-horizontal{margin-top:-25px}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header.cdk-program-focused{background-color:transparent}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-icon-selected{background-color:transparent;color:#fff;background-image:linear-gradient(to right,#0dbab5,#1a96c6)}@media only screen and (max-width: 576px){.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-label .mat-step-text-label{white-space:pre-wrap;overflow:visible}}.mat-stepper-horizontal .mat-horizontal-content-container{overflow:visible}@media only screen and (max-width: 768px){.mat-stepper-horizontal .mat-horizontal-content-container{padding:0 0 24px}}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:after,.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:before{display:none}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:before{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);left:0}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:after{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);right:0}.form-wrapper{padding:30px 15px;border:1px solid #dde0e2}.form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.form-wrapper .buttons-wrapper button:hover{opacity:.7}.form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.form-wrapper .upload-wrapper button span{margin:0 10px}.renameFileComponent .form-wrapper{padding:30px 15px;border:none!important}.renameFileComponent .form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.renameFileComponent .form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.renameFileComponent .form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.renameFileComponent .form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.renameFileComponent .form-wrapper .buttons-wrapper button:hover{opacity:.7}.renameFileComponent .form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.renameFileComponent .form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.renameFileComponent .form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.renameFileComponent .form-wrapper .upload-wrapper button span{margin:0 10px}.my-dynamic-viewer{display:flex;align-items:center;font-size:12px;min-height:30px}.my-dynamic-viewer .my-label{font-size:12px;font-weight:500;width:150px;word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-label{width:50%}}.my-dynamic-viewer .my-value{width:calc(100% - 150px);word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-value{width:50%}}.my-dynamic-viewer .direction-img{font-size:14px}.my-dynamic-viewer .direction-img .incoming{display:none}.my-dynamic-viewer .direction-img .outgoing{display:none}.my-dynamic-viewer .direction-img .internal{display:none}.my-dynamic-viewer.draft .my-value{color:#596973}.my-dynamic-viewer.inProgress .my-value{color:#3c3cf0}.my-dynamic-viewer.registered .my-value{color:#4f008c}.my-dynamic-viewer.archived .my-value{color:#fbb62c}.my-dynamic-viewer.closed .my-value{color:#00dca5}.my-dynamic-viewer.approved .my-value{color:#06a57e}.my-dynamic-viewer.assigned .my-value{color:#fd6670}.my-dynamic-viewer.sent .my-value{color:#3c3cf0}.my-dynamic-viewer.published .my-value{color:#00dca5}.my-dynamic-viewer.Outgoing .my-value{display:flex}.my-dynamic-viewer.Outgoing .my-value .direction-img .outgoing{color:#fbb62c;margin:1px 5px;display:flex}.my-dynamic-viewer.Outgoing .my-value .text{margin:0 5px}.my-dynamic-viewer.Internal .my-value{display:flex}.my-dynamic-viewer.Internal .my-value .direction-img .internal{color:#3c3cf0;margin:1px 5px;display:flex}.my-dynamic-viewer.Internal .my-value .text{margin:0 5px}.my-dynamic-viewer.Incoming .my-value{display:flex}.my-dynamic-viewer.Incoming .my-value .direction-img .incoming{color:#00dca5;display:flex}.my-dynamic-viewer.Incoming .my-value .text{margin:-3px 5px 0}.my-dynamic-viewer.vertical{display:block}.my-dynamic-viewer.vertical .my-label{width:auto}.my-dynamic-viewer.vertical .my-value{width:auto}.my-dynamic-viewer.with-out-label{width:100%!important}.caret-icon{color:#6c757d;font-size:14px}.multiple-treeview .mat-checkbox-ripple .mat-ripple-element,.multiple-treeview .mat-checkbox-checked.mat-accent .mat-checkbox-background{background-color:#33e3b7!important}.multiple-treeview .mat-checkbox-ripple .mat-ripple-element{position:fixed;left:inherit;top:inherit;transform:translate(-3px,-3px)!important}.multiple-treeview mat-checkbox .mat-checkbox-background{background-color:#d9dce2!important}.form-check-label-treeview{display:flex;align-items:center;justify-content:space-between;width:100%}.form-check-label-treeview .hoverField{display:none;align-items:center;text-align:center}.form-check-label-treeview .hoverField span{display:flex;align-items:center;justify-content:center;margin:0 3px;border:none;background-color:snow;background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:30px;width:30px;color:#fff;border-radius:5px;list-style:none;margin-inline-end:4px}.form-check-label-treeview .hoverField span .bi-plus{font-size:28px;display:flex;justify-content:center}.form-check-label-treeview .hoverField .add-btn{width:164px;padding:1px;display:flex;justify-content:center;align-items:center;font-size:13px;background-color:#0dbab5;border-radius:5px;border:0;color:#fff;--tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, .1), 0 1px 2px 0 rgba(0, 0, 0, .06);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.form-check-label-treeview .hoverField .plus-btn{display:flex;font-size:28px;align-items:center}.selected{background-color:#f5f6f8}.selected .hoverField{display:flex!important}.selected-form-control{background-color:#d9dce2}.selected-form-control .hoverField{display:flex!important}.treeview-item .row-item{display:flex;align-items:center;padding:5px 10px}.treeview-item .row-item .multiple-checkBox{margin-inline-start:4px;margin-inline-end:4px}.treeview-item .active{background-color:#f5f6f8}.treeview-row{display:flex;align-items:center}.treeview-row:hover{background-color:#f5f6f8}.treeview-row-form-control{display:flex;align-items:center}.treeview-row-form-control:hover{background-color:#d9dce2}label{margin-bottom:0;cursor:pointer}.bi{cursor:pointer;margin-right:.3rem}ngx-treeview .treeview-container{max-height:200px!important;overflow-x:hidden;scrollbar-color:#b4bac6 transparent!important;scrollbar-width:thin!important;overflow-y:auto}ngx-treeview .select-default{display:flex;justify-content:start;font-size:13px;cursor:pointer;margin-bottom:3px;margin-top:4px}ngx-treeview .dropdown-divider-noMargin{margin-top:0!important}.tree-view ngx-treeview .treeview-container{max-height:500px!important;overflow-x:hidden}.tree-view-form-control ngx-treeview .treeview-container{max-height:300px!important;overflow-x:hidden}ngx-dropdown-treeview .dropdown .dropdown-menu{margin-top:0!important;width:100%}ngx-dropdown-treeview .dropdown .btn-outline-secondary{background-color:#8f98aa1a;border:none!important}ngx-dropdown-treeview .dropdown .btn-outline-secondary:hover{color:#6c757d!important}ngx-dropdown-treeview .dropdown .btn-outline-secondary:focus{box-shadow:none!important}ngx-dropdown-treeview .dropdown .btn-outline-secondary:active{background-color:#8f98aa1a!important;border:none!important;color:#6c757d!important}ngx-dropdown-treeview .dropdown:after{position:static!important}ngx-dropdown-treeview .show .dropdown-toggle{background-color:#8f98aa1a!important;border:none!important;color:#6c757d!important}.rtl .treeview-item .treeview-item{margin-right:2rem!important;margin-left:0!important}.rtl .row-all .col-12{text-align:right}.rtl .row-all .col-12 .pull-right{float:left!important}.rtl .form-check.form-check-inline{margin-right:0!important}.rtl .btn.dropdown-toggle{margin-right:0!important}.rtl .dropdown-menu:not(ngb-datepicker){right:0px;left:unset}.rtl .dropdown :after{margin-top:.6rem;left:.6rem;right:unset!important}.rtl ngx-treeview-item{text-align:right;direction:rtl}@media (min-width: 576px){.rtl .form-inline .form-check-input{margin:3px}}.rtl .form-inline .form-check-input{margin:3px;position:inherit}.rtl .dropdown button{text-align:right!important;direction:rtl}.rtl .fa.fa-caret-right{transform:rotate(180deg)}\n"], components: [{ type: i7__namespace.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "id", "labelPosition", "name", "required", "checked", "disabled", "indeterminate", "aria-describedby", "value"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: i1__namespace$2.DropdownTreeviewComponent, selector: "ngx-dropdown-treeview", inputs: ["buttonClass", "config", "headerTemplate", "itemTemplate", "items"], outputs: ["selectedChange", "filterChange"] }, { type: i1__namespace$2.TreeviewComponent, selector: "ngx-treeview", inputs: ["config", "headerTemplate", "itemTemplate", "items"], outputs: ["selectedChange", "filterChange"] }], directives: [{ type: i3__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3__namespace$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3__namespace$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i8__namespace$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltipPosition", "matTooltipDisabled", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { type: i6__namespace.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i6__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i6__namespace.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "translate": i1__namespace$1.TranslatePipe }, encapsulation: i0__namespace.ViewEncapsulation.None });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: TreeviewSelectComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -8547,6 +8548,10 @@
                     type: i0.Input
                 }], placeholder: [{
                     type: i0.Input
+                }], displayDepTypee: [{
+                    type: i0.Input
+                }], displayIsAllowRecExternal: [{
+                    type: i0.Input
                 }], actionClicked: [{
                     type: i0.Output
                 }], dropdownTreeviewComponent: [{
@@ -8582,6 +8587,8 @@
             /** is tree searchable */
             this.searchable = true;
             this.defaultSelect = false;
+            this.displayDepTypee = true;
+            this.displayIsAllowRecExternal = true;
             /** to allow custom paramsto be passed to get departments request from outside the component */
             this.customParams = {};
             /** emitted when item is selected */
@@ -8757,7 +8764,7 @@
         return DynamicFormDepartmentComponent;
     }());
     DynamicFormDepartmentComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: DynamicFormDepartmentComponent, deps: [{ token: TranslationService$1 }, { token: DepartmentApiService }, { token: i6__namespace.NgControl, optional: true, self: true }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    DynamicFormDepartmentComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.4", type: DynamicFormDepartmentComponent, selector: "app-dynamic-form-department", inputs: { treeview: "treeview", treeViewAsFormControl: "treeViewAsFormControl", placeholder: "placeholder", multiple: "multiple", searchable: "searchable", label: "label", defaultSelect: "defaultSelect", pp_departmentNestedTree: "pp_departmentNestedTree", pp_departmentTree: "pp_departmentTree", customPrefix: "customPrefix", useCustomAddEditAction: "useCustomAddEditAction", customParentProperty: "customParentProperty", customParams: "customParams" }, outputs: { onSelecting: "onSelecting", actionClicked: "actionClicked" }, ngImport: i0__namespace, template: "<ng-container *ngIf=\"label\">\r\n  <div>\r\n    <label class=\"select-label\"\r\n      >{{ label | translate\r\n      }}<span *ngIf=\"isRequired()\" class=\"text-danger m-1\">*</span></label\r\n    >\r\n  </div>\r\n</ng-container>\r\n<app-dynamic-form-treeview-select\r\n  [treeview]=\"treeview\"\r\n  [treeViewAsFormControl]=\"treeViewAsFormControl\"\r\n  [defaultSelect]=\"defaultSelect\"\r\n  [multiple]=\"multiple\"\r\n  [items]=\"data\"\r\n  [placeholder]=\"placeholder\"\r\n  [pp_departmentNestedTree]=\"pp_departmentNestedTree\"\r\n  [useCustomAddEditAction]=\"useCustomAddEditAction\"\r\n  [customPrefix]=\"customPrefix\"\r\n  [customParentProperty]=\"customParentProperty\"\r\n  (valueChange)=\"getSelecteditems($event)\"\r\n  [(value)]=\"selection\"\r\n  (actionClicked)=\"onAction($event)\"\r\n  class=\"dropdown-wrapper\"\r\n  [ngClass]=\"{'input-filled' : selection && selection.length > 0 }\"\r\n>\r\n</app-dynamic-form-treeview-select>\r\n<mat-error\r\n  [attr.data-automation-id]=\"'card-textitem-error-'\"\r\n  class=\"app-textitem-editable-error\"\r\n  *ngIf=\"hasErrors()\"\r\n>\r\n  <ul>\r\n    <li *ngIf=\"control.errors.required\">\r\n      {{ \"VALIDATORS.REQUIRED\" | translate }}\r\n    </li>\r\n  </ul>\r\n</mat-error>\r\n", styles: ["app-dynamic-form-department .dropdown{border:1px solid #ccc!important;border-radius:5px!important}app-dynamic-form-department .input-filled .dropdown{border-color:#1a96c6!important}\n"], components: [{ type: TreeviewSelectComponent, selector: "app-dynamic-form-treeview-select", inputs: ["treeview", "treeViewAsFormControl", "config", "items", "value", "multiple", "defaultSelect", "pp_departmentNestedTree", "useCustomAddEditAction", "customPrefix", "customParentProperty", "placeholder"], outputs: ["valueChange", "plusClicked", "actionClicked"] }], directives: [{ type: i3__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i6__namespace$2.MatError, selector: "mat-error", inputs: ["id"] }], pipes: { "translate": i1__namespace$1.TranslatePipe }, encapsulation: i0__namespace.ViewEncapsulation.None });
+    DynamicFormDepartmentComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.4", type: DynamicFormDepartmentComponent, selector: "app-dynamic-form-department", inputs: { treeview: "treeview", treeViewAsFormControl: "treeViewAsFormControl", placeholder: "placeholder", multiple: "multiple", searchable: "searchable", label: "label", defaultSelect: "defaultSelect", displayDepTypee: "displayDepTypee", displayIsAllowRecExternal: "displayIsAllowRecExternal", pp_departmentNestedTree: "pp_departmentNestedTree", pp_departmentTree: "pp_departmentTree", customPrefix: "customPrefix", useCustomAddEditAction: "useCustomAddEditAction", customParentProperty: "customParentProperty", customParams: "customParams" }, outputs: { onSelecting: "onSelecting", actionClicked: "actionClicked" }, ngImport: i0__namespace, template: "<ng-container *ngIf=\"label\">\r\n  <div>\r\n    <label class=\"select-label\"\r\n      >{{ label | translate\r\n      }}<span *ngIf=\"isRequired()\" class=\"text-danger m-1\">*</span></label\r\n    >\r\n  </div>\r\n</ng-container>\r\n<app-dynamic-form-treeview-select\r\n  [treeview]=\"treeview\"\r\n  [treeViewAsFormControl]=\"treeViewAsFormControl\"\r\n  [defaultSelect]=\"defaultSelect\"\r\n  [multiple]=\"multiple\"\r\n  [items]=\"data\"\r\n  [placeholder]=\"placeholder\"\r\n  [displayDepTypee]=\"displayDepTypee\"\r\n  [displayIsAllowRecExternal]=\"displayIsAllowRecExternal\"\r\n  [pp_departmentNestedTree]=\"pp_departmentNestedTree\"\r\n  [useCustomAddEditAction]=\"useCustomAddEditAction\"\r\n  [customPrefix]=\"customPrefix\"\r\n  [customParentProperty]=\"customParentProperty\"\r\n  (valueChange)=\"getSelecteditems($event)\"\r\n  [(value)]=\"selection\"\r\n  (actionClicked)=\"onAction($event)\"\r\n  class=\"dropdown-wrapper\"\r\n  [ngClass]=\"{'input-filled' : selection && selection.length > 0 }\"\r\n>\r\n</app-dynamic-form-treeview-select>\r\n<mat-error\r\n  [attr.data-automation-id]=\"'card-textitem-error-'\"\r\n  class=\"app-textitem-editable-error\"\r\n  *ngIf=\"hasErrors()\"\r\n>\r\n  <ul>\r\n    <li *ngIf=\"control.errors.required\">\r\n      {{ \"VALIDATORS.REQUIRED\" | translate }}\r\n    </li>\r\n  </ul>\r\n</mat-error>\r\n", styles: ["app-dynamic-form-department .dropdown{border:1px solid #ccc!important;border-radius:5px!important}app-dynamic-form-department .input-filled .dropdown{border-color:#1a96c6!important}\n"], components: [{ type: TreeviewSelectComponent, selector: "app-dynamic-form-treeview-select", inputs: ["treeview", "treeViewAsFormControl", "config", "items", "value", "multiple", "defaultSelect", "pp_departmentNestedTree", "useCustomAddEditAction", "customPrefix", "customParentProperty", "placeholder", "displayDepTypee", "displayIsAllowRecExternal"], outputs: ["valueChange", "plusClicked", "actionClicked"] }], directives: [{ type: i3__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i6__namespace$2.MatError, selector: "mat-error", inputs: ["id"] }], pipes: { "translate": i1__namespace$1.TranslatePipe }, encapsulation: i0__namespace.ViewEncapsulation.None });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: DynamicFormDepartmentComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -8786,6 +8793,10 @@
                     type: i0.Input
                 }], defaultSelect: [{
                     type: i0.Input
+                }], displayDepTypee: [{
+                    type: i0.Input
+                }], displayIsAllowRecExternal: [{
+                    type: i0.Input
                 }], pp_departmentNestedTree: [{
                     type: i0.Input
                 }], pp_departmentTree: [{
@@ -15674,7 +15685,7 @@
             var _b, _c, _d;
             var contructedParms = {};
             this.text = params['search_query'];
-            if (this.text.trim()) {
+            if (this.text && this.text.trim()) {
                 if (this.useToggleFilters) {
                     if (params['quickFilters']) {
                         this.quickFilters = params['quickFilters'];
@@ -18639,7 +18650,7 @@
         return FilterComponent;
     }());
     FilterComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: FilterComponent, deps: [{ token: i6__namespace.FormBuilder }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    FilterComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.4", type: FilterComponent, selector: "cts-filter", inputs: { fields: "fields", filterTitle: "filterTitle" }, outputs: { onFiltering: "onFiltering" }, ngImport: i0__namespace, template: "<div class=\"filter-wrapper\">\r\n    <div class=\"filter-title\">\r\n        <!-- {{filterTitle | translate}} -->\r\n    </div>\r\n    <div class=\"iner-filter-wrapper\" *ngIf=\"filterForm\">\r\n        <form [formGroup]=\"filterForm\">\r\n            <div class=\"single-control-wrapper\" *ngFor=\"let field of fields\">\r\n\r\n                <div class=\"control\" *ngIf=\"field.type === 'text'\">\r\n                    <app-dynamic-form-textitem\r\n                    [label]=\"field.label\"\r\n                    [formControlName]=\"field.formControlName\"\r\n                    placeholder=\"{{ 'CREATE.PLACE_HOLDER' | translate }} {{\r\n                        field.placeholder | translate\r\n                      }}\"\r\n                  >\r\n                  </app-dynamic-form-textitem>\r\n                </div>\r\n\r\n                <div class=\"control\" *ngIf=\"field.type === 'dropdown'\">\r\n                    <app-dynamic-form-vocabulary-item\r\n                    [shwoAllValues]=\"false\"\r\n                    [label]=\"field.label\"\r\n                    [bindLabel]=\"field.bindLabel\"\r\n                    [bindValue]=\"field.bindValue\"\r\n                    [placeholder]=\"field.placeholder | translate\"\r\n                    [multiple]=\"field.multiple\"\r\n                    [searchable]=\"field.searchable\"\r\n                    [closeOnSelect]=\"field.closeOnSelect\"\r\n                    [hideSelectedItems]=\"field.hideSelectedItems\"\r\n                    [vocabularyType]=\"field.vocabularyType\"\r\n                    [formControlName]=\"field.formControlName\"\r\n                  >\r\n                  </app-dynamic-form-vocabulary-item>\r\n                </div>\r\n\r\n                <div class=\"control\" *ngIf=\"field.type === 'rang'\">\r\n                    <cts-dynamic-form-hijri-dateitem [label]=\"field.label\" [formControlName]=\"field.formControlName\"[range]=\"true\" [vertical]=\"false\" >\r\n                    </cts-dynamic-form-hijri-dateitem>\r\n                </div>\r\n\r\n                <div  class=\"control\" *ngIf=\"field.type === 'department'\">\r\n                    <app-dynamic-form-department\r\n                    [label]=\"field.label\"\r\n                    placeholder=\"{{ 'CREATE.PLACE_HOLDER' | translate }} {{\r\n                        field.placeholder | translate\r\n                    }}\"\r\n                    [formControlName]=\"field.formControlName\"\r\n                  >\r\n                  </app-dynamic-form-department>\r\n                </div>\r\n\r\n                <div  class=\"control\" *ngIf=\"field.type === 'toggle'\">\r\n                    <cts-dynamic-form-slide-toggleitem\r\n                    [label]=\"field.label\"\r\n                    [formControlName]=\"field.formControlName\"\r\n                  ></cts-dynamic-form-slide-toggleitem>\r\n                </div>\r\n\r\n                <div   class=\"control\" *ngIf=\"field.type === 'date'\">\r\n                    <cts-dynamic-form-hijri-dateitem\r\n                    [formControlName]=\"field.formControlName\"\r\n                    [label]=\"field.label\"\r\n                  >\r\n                  </cts-dynamic-form-hijri-dateitem>\r\n                </div>\r\n  \r\n\r\n            </div>\r\n\r\n        </form>\r\n           \r\n    </div>\r\n    <div class=\"form-actions\">\r\n        <button class=\"my-button mx-2\" type=\"button\" (click)=\"filter()\"> {{'FILTER' | translate}}</button>\r\n        <button class=\"my-button reset mx-2\" type=\"button\" (click)=\"reset()\"> {{'reset' | translate}}</button>\r\n    </div>\r\n</div>\r\n\r\n", styles: [".bi{margin:0!important}.memo-sorting-wrapper{width:265px;margin:0 10px;height:100%;display:flex}.memo-sorting-wrapper .sorting-direction{width:65px;height:40px;background-color:#465573;color:#fff;font-size:20px;display:flex;justify-content:center;align-items:center;cursor:pointer}.memo-sorting-wrapper .memo-sorting-trigger{width:calc(100% - 65px);height:100%;background-color:transparent;border:1px solid lightgrey;display:flex;justify-content:space-between;align-items:center;padding:0 15px;font-size:14px}.memo-sorting-wrapper .memo-sorting-trigger i{font-size:16px;color:gray}.memo-sorting-menu{width:200px}.my-button{border:1px solid #465573;color:#465573;border-radius:5px;background-color:transparent;font-weight:bold;min-width:80px;height:40px}.my-button.reset{border:none}.my-button:hover{color:#fff;background-color:#465573}.my-button:hover.reset{color:#465573;border:1px solid #465573;background-color:#fff}.app-property-value .app-input-wrapper label{color:#646f85;font-size:13px;margin-bottom:5px}.app-property-value .app-input-wrapper label .text-danger{font-size:16px;line-height:14px;margin:0 5px!important}.app-property-value .app-input-wrapper .form-control{border:1px solid #ccc;border-radius:5px;background-color:#8f98aa1a;height:40px}.app-property-value .app-input-wrapper .form-control:disabled{background-color:#e9ecef!important}.app-property-value .app-input-wrapper .form-control:focus{border:1px solid #1a96c6;box-shadow:0 0 4px #79c3c26b!important}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers{list-style:none;padding:0;margin:0;font-size:14px}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers .error{margin-top:5px}.autocomplete-container .input-container input:focus,hijri-gregorian-datepicker .form-group .input-group .form-control:focus,.ng-select.ng-select-focused .ng-select-container{border:1px solid #1a96c6!important;box-shadow:0 0 4px #79c3c26b!important}input::placeholder{font-size:12px}.form-control:focus{box-shadow:none!important}.mat-stepper-horizontal{margin-top:-25px}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header.cdk-program-focused{background-color:transparent}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-icon-selected{background-color:transparent;color:#fff;background-image:linear-gradient(to right,#0dbab5,#1a96c6)}@media only screen and (max-width: 576px){.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-label .mat-step-text-label{white-space:pre-wrap;overflow:visible}}.mat-stepper-horizontal .mat-horizontal-content-container{overflow:visible}@media only screen and (max-width: 768px){.mat-stepper-horizontal .mat-horizontal-content-container{padding:0 0 24px}}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:after,.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:before{display:none}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:before{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);left:0}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:after{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);right:0}.form-wrapper{padding:30px 15px;border:1px solid #dde0e2}.form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.form-wrapper .buttons-wrapper button:hover{opacity:.7}.form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.form-wrapper .upload-wrapper button span{margin:0 10px}.renameFileComponent .form-wrapper{padding:30px 15px;border:none!important}.renameFileComponent .form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.renameFileComponent .form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.renameFileComponent .form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.renameFileComponent .form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.renameFileComponent .form-wrapper .buttons-wrapper button:hover{opacity:.7}.renameFileComponent .form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.renameFileComponent .form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.renameFileComponent .form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.renameFileComponent .form-wrapper .upload-wrapper button span{margin:0 10px}.my-dynamic-viewer{display:flex;align-items:center;font-size:12px;min-height:30px}.my-dynamic-viewer .my-label{font-size:12px;font-weight:500;width:150px;word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-label{width:50%}}.my-dynamic-viewer .my-value{width:calc(100% - 150px);word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-value{width:50%}}.my-dynamic-viewer .direction-img{font-size:14px}.my-dynamic-viewer .direction-img .incoming{display:none}.my-dynamic-viewer .direction-img .outgoing{display:none}.my-dynamic-viewer .direction-img .internal{display:none}.my-dynamic-viewer.draft .my-value{color:#596973}.my-dynamic-viewer.inProgress .my-value{color:#3c3cf0}.my-dynamic-viewer.registered .my-value{color:#4f008c}.my-dynamic-viewer.archived .my-value{color:#fbb62c}.my-dynamic-viewer.closed .my-value{color:#00dca5}.my-dynamic-viewer.approved .my-value{color:#06a57e}.my-dynamic-viewer.assigned .my-value{color:#fd6670}.my-dynamic-viewer.sent .my-value{color:#3c3cf0}.my-dynamic-viewer.published .my-value{color:#00dca5}.my-dynamic-viewer.Outgoing .my-value{display:flex}.my-dynamic-viewer.Outgoing .my-value .direction-img .outgoing{color:#fbb62c;margin:1px 5px;display:flex}.my-dynamic-viewer.Outgoing .my-value .text{margin:0 5px}.my-dynamic-viewer.Internal .my-value{display:flex}.my-dynamic-viewer.Internal .my-value .direction-img .internal{color:#3c3cf0;margin:1px 5px;display:flex}.my-dynamic-viewer.Internal .my-value .text{margin:0 5px}.my-dynamic-viewer.Incoming .my-value{display:flex}.my-dynamic-viewer.Incoming .my-value .direction-img .incoming{color:#00dca5;display:flex}.my-dynamic-viewer.Incoming .my-value .text{margin:-3px 5px 0}.my-dynamic-viewer.vertical{display:block}.my-dynamic-viewer.vertical .my-label{width:auto}.my-dynamic-viewer.vertical .my-value{width:auto}.my-dynamic-viewer.with-out-label{width:100%!important}.filter-wrapper .filter-title{font-size:18px;font-weight:bold;margin-bottom:15px}.filter-wrapper .iner-filter-wrapper{height:320px;overflow:auto;scrollbar-color:#b4bac6 transparent!important;scrollbar-width:thin!important;padding:15px 15px 0}.filter-wrapper .iner-filter-wrapper .single-control-wrapper{margin-bottom:15px}.filter-wrapper .form-actions{display:flex;justify-content:flex-start;align-content:center;padding:10px 15px}.filter-wrapper .form-actions .filter{border:none;background-color:transparent;font-weight:bold;width:80px;height:40px;background-image:linear-gradient(to bottom,#0dbab5,#2e62df);color:#fff;border-radius:5px}\n"], components: [{ type: DynamicFormTextItemComponent, selector: "app-dynamic-form-textitem", inputs: ["autoComplete", "nativeAutoComplete", "autoComplete_pageProvider", "autoComplete_propertyName", "autoComplete_propertyKey", "autoCompleteValueKey", "autoCompleteType", "tenantId", "emitFullObject", "outsideParams", "type", "property", "label", "editable", "placeholder", "disabled", "displayEmpty", "preventSpace", "id", "maxCharsNum"] }, { type: DynamicFormVocabularyItemComponent, selector: "app-dynamic-form-vocabulary-item", inputs: ["bindValue", "bindLabel", "placeholder", "multiple", "searchable", "closeOnSelect", "hideSelectedItems", "disabled", "vocabularyType", "label", "cacheable", "shwoAllValues"], outputs: ["onSelecting"] }, { type: DynamicFormHijriDateitemComponent, selector: "cts-dynamic-form-hijri-dateitem", inputs: ["minHijri", "maxHijri", "minGreg", "maxGreg", "label", "isDisabled", "range", "vertical", "isReadOnly", "placeholder"], outputs: ["valueChanged"] }, { type: DynamicFormDepartmentComponent, selector: "app-dynamic-form-department", inputs: ["treeview", "treeViewAsFormControl", "placeholder", "multiple", "searchable", "label", "defaultSelect", "pp_departmentNestedTree", "pp_departmentTree", "customPrefix", "useCustomAddEditAction", "customParentProperty", "customParams"], outputs: ["onSelecting", "actionClicked"] }, { type: DynamicFormSlideToggleitemComponent, selector: "cts-dynamic-form-slide-toggleitem", inputs: ["label", "disabled", "checked", "theme"], outputs: ["onToggle"] }], directives: [{ type: i3__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6__namespace.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i6__namespace.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i6__namespace.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i3__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i6__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i6__namespace.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }], pipes: { "translate": i1__namespace$1.TranslatePipe } });
+    FilterComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.4", type: FilterComponent, selector: "cts-filter", inputs: { fields: "fields", filterTitle: "filterTitle" }, outputs: { onFiltering: "onFiltering" }, ngImport: i0__namespace, template: "<div class=\"filter-wrapper\">\r\n    <div class=\"filter-title\">\r\n        <!-- {{filterTitle | translate}} -->\r\n    </div>\r\n    <div class=\"iner-filter-wrapper\" *ngIf=\"filterForm\">\r\n        <form [formGroup]=\"filterForm\">\r\n            <div class=\"single-control-wrapper\" *ngFor=\"let field of fields\">\r\n\r\n                <div class=\"control\" *ngIf=\"field.type === 'text'\">\r\n                    <app-dynamic-form-textitem\r\n                    [label]=\"field.label\"\r\n                    [formControlName]=\"field.formControlName\"\r\n                    placeholder=\"{{ 'CREATE.PLACE_HOLDER' | translate }} {{\r\n                        field.placeholder | translate\r\n                      }}\"\r\n                  >\r\n                  </app-dynamic-form-textitem>\r\n                </div>\r\n\r\n                <div class=\"control\" *ngIf=\"field.type === 'dropdown'\">\r\n                    <app-dynamic-form-vocabulary-item\r\n                    [shwoAllValues]=\"false\"\r\n                    [label]=\"field.label\"\r\n                    [bindLabel]=\"field.bindLabel\"\r\n                    [bindValue]=\"field.bindValue\"\r\n                    [placeholder]=\"field.placeholder | translate\"\r\n                    [multiple]=\"field.multiple\"\r\n                    [searchable]=\"field.searchable\"\r\n                    [closeOnSelect]=\"field.closeOnSelect\"\r\n                    [hideSelectedItems]=\"field.hideSelectedItems\"\r\n                    [vocabularyType]=\"field.vocabularyType\"\r\n                    [formControlName]=\"field.formControlName\"\r\n                  >\r\n                  </app-dynamic-form-vocabulary-item>\r\n                </div>\r\n\r\n                <div class=\"control\" *ngIf=\"field.type === 'rang'\">\r\n                    <cts-dynamic-form-hijri-dateitem [label]=\"field.label\" [formControlName]=\"field.formControlName\"[range]=\"true\" [vertical]=\"false\" >\r\n                    </cts-dynamic-form-hijri-dateitem>\r\n                </div>\r\n\r\n                <div  class=\"control\" *ngIf=\"field.type === 'department'\">\r\n                    <app-dynamic-form-department\r\n                    [label]=\"field.label\"\r\n                    placeholder=\"{{ 'CREATE.PLACE_HOLDER' | translate }} {{\r\n                        field.placeholder | translate\r\n                    }}\"\r\n                    [formControlName]=\"field.formControlName\"\r\n                  >\r\n                  </app-dynamic-form-department>\r\n                </div>\r\n\r\n                <div  class=\"control\" *ngIf=\"field.type === 'toggle'\">\r\n                    <cts-dynamic-form-slide-toggleitem\r\n                    [label]=\"field.label\"\r\n                    [formControlName]=\"field.formControlName\"\r\n                  ></cts-dynamic-form-slide-toggleitem>\r\n                </div>\r\n\r\n                <div   class=\"control\" *ngIf=\"field.type === 'date'\">\r\n                    <cts-dynamic-form-hijri-dateitem\r\n                    [formControlName]=\"field.formControlName\"\r\n                    [label]=\"field.label\"\r\n                  >\r\n                  </cts-dynamic-form-hijri-dateitem>\r\n                </div>\r\n  \r\n\r\n            </div>\r\n\r\n        </form>\r\n           \r\n    </div>\r\n    <div class=\"form-actions\">\r\n        <button class=\"my-button mx-2\" type=\"button\" (click)=\"filter()\"> {{'FILTER' | translate}}</button>\r\n        <button class=\"my-button reset mx-2\" type=\"button\" (click)=\"reset()\"> {{'reset' | translate}}</button>\r\n    </div>\r\n</div>\r\n\r\n", styles: [".bi{margin:0!important}.memo-sorting-wrapper{width:265px;margin:0 10px;height:100%;display:flex}.memo-sorting-wrapper .sorting-direction{width:65px;height:40px;background-color:#465573;color:#fff;font-size:20px;display:flex;justify-content:center;align-items:center;cursor:pointer}.memo-sorting-wrapper .memo-sorting-trigger{width:calc(100% - 65px);height:100%;background-color:transparent;border:1px solid lightgrey;display:flex;justify-content:space-between;align-items:center;padding:0 15px;font-size:14px}.memo-sorting-wrapper .memo-sorting-trigger i{font-size:16px;color:gray}.memo-sorting-menu{width:200px}.my-button{border:1px solid #465573;color:#465573;border-radius:5px;background-color:transparent;font-weight:bold;min-width:80px;height:40px}.my-button.reset{border:none}.my-button:hover{color:#fff;background-color:#465573}.my-button:hover.reset{color:#465573;border:1px solid #465573;background-color:#fff}.app-property-value .app-input-wrapper label{color:#646f85;font-size:13px;margin-bottom:5px}.app-property-value .app-input-wrapper label .text-danger{font-size:16px;line-height:14px;margin:0 5px!important}.app-property-value .app-input-wrapper .form-control{border:1px solid #ccc;border-radius:5px;background-color:#8f98aa1a;height:40px}.app-property-value .app-input-wrapper .form-control:disabled{background-color:#e9ecef!important}.app-property-value .app-input-wrapper .form-control:focus{border:1px solid #1a96c6;box-shadow:0 0 4px #79c3c26b!important}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers{list-style:none;padding:0;margin:0;font-size:14px}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers .error{margin-top:5px}.autocomplete-container .input-container input:focus,hijri-gregorian-datepicker .form-group .input-group .form-control:focus,.ng-select.ng-select-focused .ng-select-container{border:1px solid #1a96c6!important;box-shadow:0 0 4px #79c3c26b!important}input::placeholder{font-size:12px}.form-control:focus{box-shadow:none!important}.mat-stepper-horizontal{margin-top:-25px}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header.cdk-program-focused{background-color:transparent}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-icon-selected{background-color:transparent;color:#fff;background-image:linear-gradient(to right,#0dbab5,#1a96c6)}@media only screen and (max-width: 576px){.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-label .mat-step-text-label{white-space:pre-wrap;overflow:visible}}.mat-stepper-horizontal .mat-horizontal-content-container{overflow:visible}@media only screen and (max-width: 768px){.mat-stepper-horizontal .mat-horizontal-content-container{padding:0 0 24px}}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:after,.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:before{display:none}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:before{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);left:0}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:after{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);right:0}.form-wrapper{padding:30px 15px;border:1px solid #dde0e2}.form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.form-wrapper .buttons-wrapper button:hover{opacity:.7}.form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.form-wrapper .upload-wrapper button span{margin:0 10px}.renameFileComponent .form-wrapper{padding:30px 15px;border:none!important}.renameFileComponent .form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.renameFileComponent .form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.renameFileComponent .form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.renameFileComponent .form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.renameFileComponent .form-wrapper .buttons-wrapper button:hover{opacity:.7}.renameFileComponent .form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.renameFileComponent .form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.renameFileComponent .form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.renameFileComponent .form-wrapper .upload-wrapper button span{margin:0 10px}.my-dynamic-viewer{display:flex;align-items:center;font-size:12px;min-height:30px}.my-dynamic-viewer .my-label{font-size:12px;font-weight:500;width:150px;word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-label{width:50%}}.my-dynamic-viewer .my-value{width:calc(100% - 150px);word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-value{width:50%}}.my-dynamic-viewer .direction-img{font-size:14px}.my-dynamic-viewer .direction-img .incoming{display:none}.my-dynamic-viewer .direction-img .outgoing{display:none}.my-dynamic-viewer .direction-img .internal{display:none}.my-dynamic-viewer.draft .my-value{color:#596973}.my-dynamic-viewer.inProgress .my-value{color:#3c3cf0}.my-dynamic-viewer.registered .my-value{color:#4f008c}.my-dynamic-viewer.archived .my-value{color:#fbb62c}.my-dynamic-viewer.closed .my-value{color:#00dca5}.my-dynamic-viewer.approved .my-value{color:#06a57e}.my-dynamic-viewer.assigned .my-value{color:#fd6670}.my-dynamic-viewer.sent .my-value{color:#3c3cf0}.my-dynamic-viewer.published .my-value{color:#00dca5}.my-dynamic-viewer.Outgoing .my-value{display:flex}.my-dynamic-viewer.Outgoing .my-value .direction-img .outgoing{color:#fbb62c;margin:1px 5px;display:flex}.my-dynamic-viewer.Outgoing .my-value .text{margin:0 5px}.my-dynamic-viewer.Internal .my-value{display:flex}.my-dynamic-viewer.Internal .my-value .direction-img .internal{color:#3c3cf0;margin:1px 5px;display:flex}.my-dynamic-viewer.Internal .my-value .text{margin:0 5px}.my-dynamic-viewer.Incoming .my-value{display:flex}.my-dynamic-viewer.Incoming .my-value .direction-img .incoming{color:#00dca5;display:flex}.my-dynamic-viewer.Incoming .my-value .text{margin:-3px 5px 0}.my-dynamic-viewer.vertical{display:block}.my-dynamic-viewer.vertical .my-label{width:auto}.my-dynamic-viewer.vertical .my-value{width:auto}.my-dynamic-viewer.with-out-label{width:100%!important}.filter-wrapper .filter-title{font-size:18px;font-weight:bold;margin-bottom:15px}.filter-wrapper .iner-filter-wrapper{height:320px;overflow:auto;scrollbar-color:#b4bac6 transparent!important;scrollbar-width:thin!important;padding:15px 15px 0}.filter-wrapper .iner-filter-wrapper .single-control-wrapper{margin-bottom:15px}.filter-wrapper .form-actions{display:flex;justify-content:flex-start;align-content:center;padding:10px 15px}.filter-wrapper .form-actions .filter{border:none;background-color:transparent;font-weight:bold;width:80px;height:40px;background-image:linear-gradient(to bottom,#0dbab5,#2e62df);color:#fff;border-radius:5px}\n"], components: [{ type: DynamicFormTextItemComponent, selector: "app-dynamic-form-textitem", inputs: ["autoComplete", "nativeAutoComplete", "autoComplete_pageProvider", "autoComplete_propertyName", "autoComplete_propertyKey", "autoCompleteValueKey", "autoCompleteType", "tenantId", "emitFullObject", "outsideParams", "type", "property", "label", "editable", "placeholder", "disabled", "displayEmpty", "preventSpace", "id", "maxCharsNum"] }, { type: DynamicFormVocabularyItemComponent, selector: "app-dynamic-form-vocabulary-item", inputs: ["bindValue", "bindLabel", "placeholder", "multiple", "searchable", "closeOnSelect", "hideSelectedItems", "disabled", "vocabularyType", "label", "cacheable", "shwoAllValues"], outputs: ["onSelecting"] }, { type: DynamicFormHijriDateitemComponent, selector: "cts-dynamic-form-hijri-dateitem", inputs: ["minHijri", "maxHijri", "minGreg", "maxGreg", "label", "isDisabled", "range", "vertical", "isReadOnly", "placeholder"], outputs: ["valueChanged"] }, { type: DynamicFormDepartmentComponent, selector: "app-dynamic-form-department", inputs: ["treeview", "treeViewAsFormControl", "placeholder", "multiple", "searchable", "label", "defaultSelect", "displayDepTypee", "displayIsAllowRecExternal", "pp_departmentNestedTree", "pp_departmentTree", "customPrefix", "useCustomAddEditAction", "customParentProperty", "customParams"], outputs: ["onSelecting", "actionClicked"] }, { type: DynamicFormSlideToggleitemComponent, selector: "cts-dynamic-form-slide-toggleitem", inputs: ["label", "disabled", "checked", "theme"], outputs: ["onToggle"] }], directives: [{ type: i3__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6__namespace.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i6__namespace.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i6__namespace.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i3__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i6__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i6__namespace.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }], pipes: { "translate": i1__namespace$1.TranslatePipe } });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: FilterComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -23732,7 +23743,7 @@
         return SelectUsersByDepartmentsComponent;
     }());
     SelectUsersByDepartmentsComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: SelectUsersByDepartmentsComponent, deps: [{ token: DepartmentManagementService }, { token: i6__namespace.NgControl, optional: true, self: true }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    SelectUsersByDepartmentsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.4", type: SelectUsersByDepartmentsComponent, selector: "app-select-users-by-departments", inputs: { display: "display", depLabel: "depLabel", userLabel: "userLabel", allowMultipleUsers: "allowMultipleUsers" }, outputs: { formChanged: "formChanged" }, host: { classAttribute: "userByDepSelectors" }, ngImport: i0__namespace, template: "<form [formGroup]=\"depAnditsUsers\">\r\n    <div class=\"w-full flex justify-between\"\r\n    [ngClass]=\"{'flex-row': display === 'row', 'flex-col': display === 'column'}\">\r\n        <div class=\"flex flex-col w-full flex-1 depWrapper\">\r\n            <label class=\"dep-label\">\r\n                {{depLabel}}\r\n            <span class=\"text-danger\" *ngIf=\"isRequired()\">*</span>\r\n            </label>\r\n            <ng-container *ngIf=\"!reseting\">\r\n                <app-dynamic-form-department \r\n                    #depRef\r\n                    formControlName=\"dep\"\r\n                    placeholder=\"placeholder\"\r\n                    [treeview]=\"false\"\r\n                    [pp_departmentNestedTree]=\"'PP_OS_Departments'\"\r\n                    [pp_departmentTree]=\"'PP_OS_Departments'\"\r\n                    [customPrefix]=\"'osdept'\"\r\n                    [customParentProperty]=\"'osdepartment_parentDepartmentCode'\"\r\n                    [useCustomAddEditAction]=\"true\"\r\n                    (onSelecting)=\"getDepMembers($event)\"\r\n                >\r\n                </app-dynamic-form-department>\r\n            </ng-container>\r\n            <ng-container *ngIf=\"reseting\">\r\n                <app-dynamic-form-department\r\n                    #depRef\r\n                    formControlName=\"dep\"\r\n                    placeholder=\"placeholder\"\r\n                    [treeview]=\"false\"\r\n                    [pp_departmentNestedTree]=\"'PP_OS_Departments'\"\r\n                    [pp_departmentTree]=\"'PP_OS_Departments'\"\r\n                    [customPrefix]=\"'osdept'\"\r\n                    [customParentProperty]=\"'osdepartment_parentDepartmentCode'\"\r\n                    [useCustomAddEditAction]=\"true\"\r\n                    (onSelecting)=\"getDepMembers($event)\"\r\n                >\r\n                </app-dynamic-form-department>\r\n            </ng-container>\r\n        </div>\r\n        <div class=\"flex flex-col w-full flex-1 usersWrapper\"\r\n        [ngClass]=\"{'mt-4': display === 'column'}\">\r\n            <label class=\"users-label\">\r\n                {{userLabel}}\r\n                <span class=\"text-danger\" *ngIf=\"isRequired()\">*</span>\r\n            </label>\r\n            <ng-select \r\n                formControlName=\"users\"\r\n                #ngSelectComponent \r\n                [items]=\"depUsers\" \r\n                bindLabel=\"properties.fullName\" \r\n                bindValue=\"properties.username\" \r\n                [multiple]=\"allowMultipleUsers\"\r\n                [placeholder]=\"'share.placeholder' | translate\"\r\n                (change)=\"setUser()\"\r\n            >\r\n                <ng-template ng-notfound-tmp let-searchTerm=\"searchTerm\">\r\n                    <div class=\"ng-option disabled\" *ngIf=\"!depAnditsUsers?.get('dep').value;else notFound\">\r\n                        {{'archiveSearch.select_dep' | translate}}\r\n                    </div>\r\n                    <ng-template #notFound>\r\n                        <div class=\"ng-option disabled\">\r\n                            {{'archiveSearch.noUsers' | translate}}\r\n                        </div>\r\n                    </ng-template>\r\n                </ng-template>\r\n                <ng-template ng-option-tmp let-item=\"item\" let-index=\"index\">\r\n                    <div class=\"flex flex-col h-full\">\r\n                        <div *ngIf=\"item\" class=\"flex flex-row\">\r\n                            <div class=\"flex-0 w-8 h-8 rounded-full overflow-hidden\">\r\n                                <cts-avatar [user]=\"{\r\n                                    properties: {\r\n                                        firstName: item.properties?.firstName,\r\n                                        lastName: item.properties?.lastName\r\n                                    }\r\n                                    }\">\r\n                                </cts-avatar>\r\n                            </div>\r\n                            <div class=\"flex flex-col  pt-0 px-2\">\r\n                                <span>{{item.properties?.fullName}}</span>\r\n                                <span>{{item.properties?.email}}</span>\r\n                            </div>\r\n                        </div>\r\n                    </div>\r\n                </ng-template>\r\n            </ng-select>\r\n        </div>\r\n    </div>\r\n</form>", styles: [".userByDepSelectors ngx-dropdown-treeview>.dropdown{@apply bg-primary-50 border-primary-100 !important;}.userByDepSelectors .ng-select .ng-select-container .ng-value-container .ng-placeholder{font-size:12px!important;margin-top:4px!important}\n"], components: [{ type: DynamicFormDepartmentComponent, selector: "app-dynamic-form-department", inputs: ["treeview", "treeViewAsFormControl", "placeholder", "multiple", "searchable", "label", "defaultSelect", "pp_departmentNestedTree", "pp_departmentTree", "customPrefix", "useCustomAddEditAction", "customParentProperty", "customParams"], outputs: ["onSelecting", "actionClicked"] }, { type: i3__namespace$4.NgSelectComponent, selector: "ng-select", inputs: ["markFirst", "dropdownPosition", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "bufferAmount", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "bindLabel", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "virtualScroll", "openOnEnter", "appendTo", "bindValue", "appearance", "maxSelectedItems", "groupBy", "groupValue", "tabIndex", "typeahead"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { type: AvatarComponent, selector: "cts-avatar", inputs: ["user"] }], directives: [{ type: i6__namespace.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i6__namespace.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i6__namespace.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i3__namespace$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i6__namespace.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i3__namespace$4.ɵl, selector: "[ng-notfound-tmp]" }, { type: i3__namespace$4.ɵf, selector: "[ng-option-tmp]" }], pipes: { "translate": i1__namespace$1.TranslatePipe }, encapsulation: i0__namespace.ViewEncapsulation.None });
+    SelectUsersByDepartmentsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.4", type: SelectUsersByDepartmentsComponent, selector: "app-select-users-by-departments", inputs: { display: "display", depLabel: "depLabel", userLabel: "userLabel", allowMultipleUsers: "allowMultipleUsers" }, outputs: { formChanged: "formChanged" }, host: { classAttribute: "userByDepSelectors" }, ngImport: i0__namespace, template: "<form [formGroup]=\"depAnditsUsers\">\r\n    <div class=\"w-full flex justify-between\"\r\n    [ngClass]=\"{'flex-row': display === 'row', 'flex-col': display === 'column'}\">\r\n        <div class=\"flex flex-col w-full flex-1 depWrapper\">\r\n            <label class=\"dep-label\">\r\n                {{depLabel}}\r\n            <span class=\"text-danger\" *ngIf=\"isRequired()\">*</span>\r\n            </label>\r\n            <ng-container *ngIf=\"!reseting\">\r\n                <app-dynamic-form-department \r\n                    #depRef\r\n                    formControlName=\"dep\"\r\n                    placeholder=\"placeholder\"\r\n                    [treeview]=\"false\"\r\n                    [pp_departmentNestedTree]=\"'PP_OS_Departments'\"\r\n                    [pp_departmentTree]=\"'PP_OS_Departments'\"\r\n                    [customPrefix]=\"'osdept'\"\r\n                    [customParentProperty]=\"'osdepartment_parentDepartmentCode'\"\r\n                    [useCustomAddEditAction]=\"true\"\r\n                    (onSelecting)=\"getDepMembers($event)\"\r\n                >\r\n                </app-dynamic-form-department>\r\n            </ng-container>\r\n            <ng-container *ngIf=\"reseting\">\r\n                <app-dynamic-form-department\r\n                    #depRef\r\n                    formControlName=\"dep\"\r\n                    placeholder=\"placeholder\"\r\n                    [treeview]=\"false\"\r\n                    [pp_departmentNestedTree]=\"'PP_OS_Departments'\"\r\n                    [pp_departmentTree]=\"'PP_OS_Departments'\"\r\n                    [customPrefix]=\"'osdept'\"\r\n                    [customParentProperty]=\"'osdepartment_parentDepartmentCode'\"\r\n                    [useCustomAddEditAction]=\"true\"\r\n                    (onSelecting)=\"getDepMembers($event)\"\r\n                >\r\n                </app-dynamic-form-department>\r\n            </ng-container>\r\n        </div>\r\n        <div class=\"flex flex-col w-full flex-1 usersWrapper\"\r\n        [ngClass]=\"{'mt-4': display === 'column'}\">\r\n            <label class=\"users-label\">\r\n                {{userLabel}}\r\n                <span class=\"text-danger\" *ngIf=\"isRequired()\">*</span>\r\n            </label>\r\n            <ng-select \r\n                formControlName=\"users\"\r\n                #ngSelectComponent \r\n                [items]=\"depUsers\" \r\n                bindLabel=\"properties.fullName\" \r\n                bindValue=\"properties.username\" \r\n                [multiple]=\"allowMultipleUsers\"\r\n                [placeholder]=\"'share.placeholder' | translate\"\r\n                (change)=\"setUser()\"\r\n            >\r\n                <ng-template ng-notfound-tmp let-searchTerm=\"searchTerm\">\r\n                    <div class=\"ng-option disabled\" *ngIf=\"!depAnditsUsers?.get('dep').value;else notFound\">\r\n                        {{'archiveSearch.select_dep' | translate}}\r\n                    </div>\r\n                    <ng-template #notFound>\r\n                        <div class=\"ng-option disabled\">\r\n                            {{'archiveSearch.noUsers' | translate}}\r\n                        </div>\r\n                    </ng-template>\r\n                </ng-template>\r\n                <ng-template ng-option-tmp let-item=\"item\" let-index=\"index\">\r\n                    <div class=\"flex flex-col h-full\">\r\n                        <div *ngIf=\"item\" class=\"flex flex-row\">\r\n                            <div class=\"flex-0 w-8 h-8 rounded-full overflow-hidden\">\r\n                                <cts-avatar [user]=\"{\r\n                                    properties: {\r\n                                        firstName: item.properties?.firstName,\r\n                                        lastName: item.properties?.lastName\r\n                                    }\r\n                                    }\">\r\n                                </cts-avatar>\r\n                            </div>\r\n                            <div class=\"flex flex-col  pt-0 px-2\">\r\n                                <span>{{item.properties?.fullName}}</span>\r\n                                <span>{{item.properties?.email}}</span>\r\n                            </div>\r\n                        </div>\r\n                    </div>\r\n                </ng-template>\r\n            </ng-select>\r\n        </div>\r\n    </div>\r\n</form>", styles: [".userByDepSelectors ngx-dropdown-treeview>.dropdown{@apply bg-primary-50 border-primary-100 !important;}.userByDepSelectors .ng-select .ng-select-container .ng-value-container .ng-placeholder{font-size:12px!important;margin-top:4px!important}\n"], components: [{ type: DynamicFormDepartmentComponent, selector: "app-dynamic-form-department", inputs: ["treeview", "treeViewAsFormControl", "placeholder", "multiple", "searchable", "label", "defaultSelect", "displayDepTypee", "displayIsAllowRecExternal", "pp_departmentNestedTree", "pp_departmentTree", "customPrefix", "useCustomAddEditAction", "customParentProperty", "customParams"], outputs: ["onSelecting", "actionClicked"] }, { type: i3__namespace$4.NgSelectComponent, selector: "ng-select", inputs: ["markFirst", "dropdownPosition", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "bufferAmount", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "bindLabel", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "virtualScroll", "openOnEnter", "appendTo", "bindValue", "appearance", "maxSelectedItems", "groupBy", "groupValue", "tabIndex", "typeahead"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { type: AvatarComponent, selector: "cts-avatar", inputs: ["user"] }], directives: [{ type: i6__namespace.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i6__namespace.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i6__namespace.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i3__namespace$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i6__namespace.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i3__namespace$4.ɵl, selector: "[ng-notfound-tmp]" }, { type: i3__namespace$4.ɵf, selector: "[ng-option-tmp]" }], pipes: { "translate": i1__namespace$1.TranslatePipe }, encapsulation: i0__namespace.ViewEncapsulation.None });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: SelectUsersByDepartmentsComponent, decorators: [{
                 type: i0.Component,
                 args: [{