nuxeo-development-framework 3.7.8 → 3.7.9-dms-mep

package/src/lib/shared/components/search-autocomplete/search-autocomplete.component.scss

@@ -0,0 +1,50 @@
+.select-label {
+  color: #8f98aa;
+  font-size: 12px;
+  margin-bottom: 0px;
+}
+.autocomplete-container .suggestions-container ul {
+  max-height: 150px !important;
+}
+
+.autocomplete-container .suggestions-container .is-visible {
+  height: 150px !important;
+  //margin-top: 10px;
+  max-height: 150px !important;
+  border: 1px lightgray solid !important;
+  box-shadow: none !important;
+}
+// .search-container {
+//   position: relative;
+// }
+
+.autocomplete-container {
+  box-shadow: none !important;
+}
+
+.autocomplete-container .input-container input {
+  background-color: rgba(143, 152, 170, 0.1) !important;
+  padding: 10px !important;
+  border: 1px solid #ccc !important;
+  border-radius: 5px !important;
+}
+
+.autocomplete-container .suggestions-container .complete-selected,
+.autocomplete-container .suggestions-container ul li:hover {
+  background-color: #f5faff !important;
+}
+
+.autocomplete-container .suggestions-container ul li{
+  padding: 8px 10px !important;
+}
+
+[dir="rtl"] {
+  .input-container input {
+    direction: rtl;
+  }
+  .x {
+    left: 10px;
+    right: auto !important;
+  }
+}
+

package/src/lib/shared/components/search-autocomplete/search-autocomplete.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { SearchAutocompleteComponent } from './search-autocomplete.component';
+
+describe('SearchAutocompleteComponent', () => {
+  let component: SearchAutocompleteComponent;
+  let fixture: ComponentFixture<SearchAutocompleteComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ SearchAutocompleteComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(SearchAutocompleteComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

package/src/lib/shared/components/search-autocomplete/search-autocomplete.component.ts

@@ -0,0 +1,153 @@
+import {
+  Component, EventEmitter, Input, OnInit, Output, ViewChild, ViewEncapsulation,
+  Optional,
+  Self,OnChanges,
+  SimpleChanges,
+} from '@angular/core';
+import { AbstractControl, ControlValueAccessor, FormControl, NgControl } from '@angular/forms';
+import { CorrespondenceRelationService } from '../../../components/correspondence-relation/services/correspondence-realation.service';
+
+/** Auto complete dropdown component
+ * @title
+ * Search Autocomplete
+ */
+@Component({
+  selector: 'cts-search-autocomplete',
+  templateUrl: './search-autocomplete.component.html',
+  styleUrls: ['./search-autocomplete.component.scss'],
+  encapsulation: ViewEncapsulation.None,
+})
+export class SearchAutocompleteComponent implements ControlValueAccessor, OnChanges {
+
+  @ViewChild(SearchAutocompleteComponent)
+  searchautocomplete: SearchAutocompleteComponent;
+
+  loading = false;
+  target: any = {};
+  @ViewChild('auto') auto;
+  /** placeholder for the input */
+  @Input() placeholder;
+  /** label for the input */
+  @Input() label;
+  /** id of correspondance that should be exluded  */
+  @Input()
+    correspondanceId;
+
+  /** direction to determin direction of corespond to search in it */
+  @Input() direction;
+
+  /** event emitter that will fire with selected item info when an item is selected */
+  @Output() onSelecting = new EventEmitter();
+
+  // function related to value accessor
+  propagateChange: any = () => { };
+  validateFn: any = () => { };
+  public onTouched: any = () => {
+    /*Empty*/
+  };
+
+  public get invalid(): boolean {
+    return this.control ? this.control.invalid : false;
+  }
+
+  public get showError(): boolean {
+    if (!this.control) {
+      return false;
+    }
+
+    const { dirty, touched } = this.control;
+
+    return this.invalid ? dirty || touched : false;
+  }
+  writeValue(value) {
+    if (value) {
+      this.target = value;
+      this.auto.query = this.target?.title;
+    }
+  }
+
+  registerOnChange(fn) {
+    this.propagateChange = fn;
+  }
+
+  registerOnTouched(fn: any) {
+    this.onTouched = fn;
+  }
+
+  validate(c: FormControl) {
+    return this.validateFn(c);
+  }
+  isRequired() {
+    if (!this.control || !this.control.control.validator) {
+      return false;
+    }
+
+    const validator = this.control.control.validator({} as AbstractControl);
+    return validator && validator.required;
+  }
+  hasErrors(): boolean {
+    return this.showError;
+  }
+  reset() {
+    this.inputCleared();
+    this.searchautocomplete.reset();
+  }
+
+  constructor(private corressvc: CorrespondenceRelationService,
+    @Self() @Optional() public control: NgControl
+  ) {
+    this.control.valueAccessor = this;
+  }
+
+  ngOnChanges(changes: SimpleChanges): void {
+    this.correspondanceId = this.correspondanceId;
+    console.log('id', this.correspondanceId);
+  }
+
+  ngOnInit(): void {
+  }
+  /**ng-Autocomplete related functions */
+  alwaysopened: boolean = false;
+  inputCleared() {
+    this.documentList = [];
+    this.auto.close();
+    this.target = {};
+    this.propagateChange();
+    this.onSelecting.emit();
+  }
+
+  selectItem(item) {
+    this.target = item;
+    this.propagateChange(item);
+    this.onSelecting.emit(item);
+
+  }
+  isLoading: boolean = false;
+  documentList: any[] = [];
+
+  onSearchInputChange(val: string) {
+    if (val?.length == 0) {
+      return;
+    }
+    this.corressvc
+      .search(val, {
+        Correspondence_replied: false,
+        Correspondence_direction: this.direction ? this.direction : null
+      })
+      .subscribe((data) => {
+         this.documentList = data.filter((correspondance) => {
+          if (this.correspondanceId) {
+            return this.correspondanceId != correspondance.id;
+          } else {
+            return correspondance;
+          }
+        });
+        // this.documentList = data;
+        this.isLoading = false;
+        return this.documentList;
+      });
+  }
+  //disableFilter = (items: any[]) => items;
+
+  close() { }
+}

package/src/lib/shared/components/spinner/spinner.component.html

@@ -0,0 +1,10 @@
+<div class="spiner-container">
+  <mat-spinner
+    [value]="90"
+    [strokeWidth]="3"
+    overlay="true"
+    [diameter]="25"
+    color="warn"
+  >
+  </mat-spinner>
+</div>

package/src/lib/shared/components/spinner/spinner.component.scss

@@ -0,0 +1,11 @@
+.spiner-container {
+  position: absolute;
+  bottom: 12px;
+  width: 100%;
+  display: flex;
+  justify-content: flex-start;
+  // left: -5px;
+  mat-spinner{
+    position: relative;
+  }
+}

package/src/lib/shared/components/spinner/spinner.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { SpinnerComponent } from './spinner.component';
+
+describe('SpinnerComponent', () => {
+  let component: SpinnerComponent;
+  let fixture: ComponentFixture<SpinnerComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ SpinnerComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(SpinnerComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

package/src/lib/shared/components/spinner/spinner.component.ts

@@ -0,0 +1,25 @@
+import { Component, OnInit } from '@angular/core';
+
+/**
+ * Basic Loading spinner component to be used in lists when loading data
+ * @title
+ * Spinner Component
+ * @example
+ *
+ * <ng-container *ngIf="loading">
+ *   <cts-spinner></cts-spinner>
+ * </ng-container>
+ */
+@Component({
+  selector: 'cts-spinner',
+  templateUrl: './spinner.component.html',
+  styleUrls: ['./spinner.component.scss']
+})
+export class SpinnerComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit(): void {
+  }
+
+}

package/src/lib/shared/components/user-card/user-card.component.html

@@ -0,0 +1,21 @@
+<ng-container *ngIf="user?.properties">
+  <div class="user-card">
+    <div class="p-1">
+      <cts-avatar class="card-avatar diameter" [user]="user" routerLink="/users/profile/{{ user.properties.username }}"></cts-avatar>
+    </div>
+    <div class="user-content">
+      <div class="first-line-container">
+        <span class="first-line" routerLink="/users/profile/{{ user.properties.username }}">
+          <ng-content select=".lineOne"></ng-content>
+        </span>
+        <span>
+          <ng-content select=".lineOnePart2 "></ng-content>
+        </span>
+      </div>
+
+      <span class="lineTwo">
+        <ng-content select=".lineTwo "></ng-content>
+      </span>
+    </div>
+  </div>
+</ng-container>

package/src/lib/shared/components/user-card/user-card.component.scss

@@ -0,0 +1,42 @@
+@import "../../../assets/scss/myApp.scss";
+.diameter {
+  width: 40px;
+  height: 40px;
+}
+.user-card {
+  font-size: 12px;
+  display: flex;
+  justify-content: center;
+}
+.card-avatar {
+  cursor: pointer;
+  display: block;
+}
+.user-content {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  padding: 0 4px;
+}
+
+.first-line {
+  display: flex;
+  flex-direction: column;
+  font-size: 12px;
+  cursor: pointer;
+  &-container {
+    display: flex;
+    align-items: center;
+  }
+}
+@media (min-width: 1679px) {
+  .diameter {
+    width: 48px;
+    height: 48px;
+  }
+
+  .user-card,
+  .first-line {
+    font-size: 16px;
+  }
+}

package/src/lib/shared/components/user-card/user-card.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { UserCardComponent } from './user-card.component';
+
+describe('UserCardComponent', () => {
+  let component: UserCardComponent;
+  let fixture: ComponentFixture<UserCardComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ UserCardComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(UserCardComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

package/src/lib/shared/components/user-card/user-card.component.ts

@@ -0,0 +1,42 @@
+import { Component, Input, OnInit } from '@angular/core';
+/**
+ * reusable user card component
+ * @title
+ * User Card
+ * @example
+ *
+ * <app-user-card [user]="NuxeoUserObject">
+ *   <div class="lineOne">
+ *     Content of card first line
+ *   </div>
+ *   <div class="lineOnePart2">
+ *     Content of card first line second part
+ *   </div>
+ *   <div class="lineTwo">
+ *     Content of card second line
+ *   </div>
+ * </app-user-card>
+ */
+@Component({
+  selector: 'app-user-card',
+  templateUrl: './user-card.component.html',
+  styleUrls: ['./user-card.component.scss'],
+})
+export class UserCardComponent implements OnInit {
+  /** Nuxeo user object */
+  @Input()
+  user;
+  /** @deprecated diameter of avatar */
+  @Input()
+  diameter;
+
+  constructor() { }
+
+  ngOnInit(): void {
+    if (screen.width <= 1536) {
+      this.diameter = 10;
+    } else if (screen.width > 1536) {
+      this.diameter = 12;
+    }
+  }
+}

package/src/lib/shared/libraryShared.module.ts

@@ -0,0 +1,47 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { TranslateModule } from '@ngx-translate/core';
+import { ReadMoreComponent } from './components/read-more/read-more.component';
+import { UserCardComponent } from './components/user-card/user-card.component';
+import { AvatarModule } from '../components/avatar/avatar.module';
+import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
+import { ButtonComponent } from './components/button/button.component';
+import { NoDataComponent } from './components/no-data/no-data.component';
+import { SpinnerComponent } from './components/spinner/spinner.component';
+import { MatIconModule } from '@angular/material/icon';
+import { MatListModule } from '@angular/material/list';
+import { MatMenuModule } from '@angular/material/menu';
+import { AutocompleteLibModule } from 'angular-ng-autocomplete';
+import { ItemListComponent } from './components/item-list/item-list.component';
+import { RouterModule } from '@angular/router';
+import { DirectiveModule } from '../directive/directive.module';
+
+/**
+ * @title
+ * Shared UI Components
+ */
+@NgModule({
+  declarations: [ReadMoreComponent, UserCardComponent, ButtonComponent, NoDataComponent, SpinnerComponent, ItemListComponent],
+  imports: [
+    AvatarModule,
+    CommonModule,
+    RouterModule,
+    TranslateModule,
+    MatProgressSpinnerModule,
+    MatIconModule,
+    MatListModule,
+    MatMenuModule,
+    AutocompleteLibModule,
+    DirectiveModule
+  ],
+  exports: [
+    UserCardComponent,
+    ReadMoreComponent,
+    TranslateModule,
+    ButtonComponent,
+    NoDataComponent,
+    SpinnerComponent, 
+    ItemListComponent
+  ],
+})
+export class LibrarySharedModule { }

package/src/lib/shared-services/dialog-mangment.service.ts

@@ -0,0 +1,62 @@
+import { Injectable } from '@angular/core';
+import { MatDialog } from '@angular/material/dialog';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class DialogMangmentService {
+  minizedModal = false;
+  creationMode='';
+  fileType = '';
+  addingFrom = '';
+  storedDynamicForm='';
+
+  constructor(private dialog: MatDialog) { }
+
+  openModal(component , type , creationMode , source , width , height, path?){
+    this.fileType = type ; 
+    this.addingFrom = source;
+    this.creationMode = creationMode;
+    let dialogRef = this.dialog.open(
+      component ,
+      {
+        width: width,
+        height: height,
+        maxWidth:'auto',
+        panelClass: 'watcher-dialog-container',
+        data: {
+          path: (path) ? path : ''
+         },
+        disableClose: true
+      }
+      );
+      dialogRef.afterClosed().subscribe(res => {
+        if(res){
+          //console.log('open minismed');
+          this.minizedModal = true;
+        }
+      })
+  }
+
+  openMinimzedModal(component , width , height,path?){
+    this.minizedModal = false;
+    let dialogRef = this.dialog.open(
+      component ,
+      {
+        width: width,
+        height: height,
+        panelClass: 'watcher-dialog-container',
+        data: {
+          path: (path) ? path : ''
+         },
+        disableClose: true
+      }
+      );
+      dialogRef.afterClosed().subscribe(res => {
+        if(res){
+          //console.log('open minismed');
+          this.minizedModal = true;
+        }
+      })
+  }
+}