@unifylib/ui-lib 1.0.3 → 1.1.4

package/src/lib/components/search-bar/search-bar.component.ts

@@ -1,70 +0,0 @@
-import {Component, EventEmitter, Input, OnInit, Output} from '@angular/core';
-import {MatFormField, MatLabel} from "@angular/material/form-field";
-import {MatOption, MatSelect} from "@angular/material/select";
-import {FormsModule} from "@angular/forms";
-import {MatIcon} from "@angular/material/icon";
-import {FlexModule} from "@angular/flex-layout";
-import {MatInput} from "@angular/material/input";
-import {MatIconButton} from "@angular/material/button";
-import {NgForOf} from "@angular/common";
-import {TableColumn} from "../../base-model";
-import {TranslateModule} from "@ngx-translate/core";
-type SearchType = 'exact' | 'like';
-type SortType = 'ASC' | 'DESC';
-@Component({
-  selector: 'ag-search-bar',
-  templateUrl: './search-bar.component.html',
-  standalone: true,
-  imports: [
-    MatFormField,
-    MatSelect,
-    MatOption,
-    FormsModule,
-    MatIcon,
-    FlexModule,
-    MatInput,
-    MatIconButton,
-    NgForOf,
-    TranslateModule
-  ],
-  styleUrls: ['./search-bar.component.scss']
-})
-export class SearchBarComponent implements OnInit {
-  @Input() columns: TableColumn<any>[];
-  @Input() defaultSortKey: string = '';
-
-  searchValue: string = '';
-  searchType: SearchType = 'like';
-  selectedSortKey: string = '';
-  selectedSortType: SortType = 'ASC';
-  @Output() searchTriggered = new EventEmitter<{
-    searchValue: string;
-    searchType: SearchType;
-    sortKey: string;
-    sortType: string;
-  }>();
-
-  onSearch() {
-    this.selectedSortKey ||= this.defaultSortKey || this.columns[0]?.property;
-
-    this.searchTriggered.emit({
-      searchValue: this.searchValue,
-      searchType: this.searchType,
-      sortKey: this.selectedSortKey,
-      sortType: this.selectedSortType
-    });
-  }
-
-  labelKey(column: { label?: string; property: string }): string {
-    return column.label || column.property;
-  }
-
-  ngOnInit(): void {
-  }
-
-  getColumns() {
-    return this.columns.filter(
-      (column) => ['text', 'date', 'localDateTime'].includes(column.type)
-    );
-  }
-}

package/src/lib/components/shared/attachment-uploader/attachment-uploader.component.css

@@ -1,54 +0,0 @@
-.attachment-uploader {
-  display: flex;
-  align-items: center;
-  justify-content: flex-start; /* <== Ensures buttons align left*/
-gap: 10px;
-  flex-wrap: wrap;
-
-
-  .upload-button {
-    display: flex;
-    align-items: center;
-    gap: 8px;
-    padding: 10px 18px;
-    border-radius: 8px;
-    font-weight: 500;
-    transition: all 0.3s ease;
-    min-width: 200px;
-    text-align: left;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-
-    mat-icon {
-      font-size: 20px;
-    }
-  }
-
-  .clear-button {
-    background-color: transparent;
-    border: none;
-    color: #d32f2f;
-    transition: color 0.2s ease;
-    padding: 4px;
-
-    &:hover {
-      color: #b71c1c;
-    }
-
-    mat-icon {
-      font-size: 20px;
-    }
-  }
-
-  .hidden-input {
-    display: none;
-  }
-}
-
-.icon-design {
-  display: flex;
-  align-items: center;
-  cursor: pointer;
-
-}

package/src/lib/components/shared/attachment-uploader/attachment-uploader.component.html

@@ -1,22 +0,0 @@
-<div class="attachment-uploader">
-  <button mat-raised-button
-          [color]="selectedFile ? 'accent' : 'primary'"
-          class="upload-button"
-          (click)="triggerAttachmentUpload()">
-    <div class="icon-design">
-      <mat-icon>attach_file</mat-icon>
-      <span *ngIf="!selectedFile">{{ 'uploadAttachment' | translate }}</span>
-      <span *ngIf="selectedFile">{{ selectedFile.name }}</span>
-    </div>
-  </button>
-
-  <button *ngIf="selectedFile"
-          mat-icon-button
-          class="clear-button"
-          (click)="clearFile()"
-          matTooltip="Remove file">
-    <mat-icon>close</mat-icon>
-  </button>
-
-  <input #fileUpload type="file" class="hidden-input" (change)="uploadFileToServer()" />
-</div>

package/src/lib/components/shared/attachment-uploader/attachment-uploader.component.spec.ts

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

package/src/lib/components/shared/attachment-uploader/attachment-uploader.component.ts

@@ -1,45 +0,0 @@
-import {Component, ElementRef, EventEmitter, Output, ViewChild} from '@angular/core';
-import {MatIcon} from "@angular/material/icon";
-import {TranslateModule} from "@ngx-translate/core";
-import {MatButton, MatIconButton} from "@angular/material/button";
-import {NgIf} from "@angular/common";
-import {MatTooltip} from "@angular/material/tooltip";
-
-@Component({
-  selector: 'app-attachment-uploader',
-  standalone: true,
-  imports: [
-    MatIcon,
-    TranslateModule,
-    MatButton,
-    NgIf,
-    MatTooltip,
-    MatIconButton,
-  ],
-  templateUrl: './attachment-uploader.component.html',
-  styleUrl: './attachment-uploader.component.css'
-})
-export class AttachmentUploaderComponent {
-  @ViewChild('fileUpload') fileUpload!: ElementRef<HTMLInputElement>;
-  @Output() fileSelected = new EventEmitter<File | null>();
-
-  selectedFile: File | null = null;
-
-  triggerAttachmentUpload(): void {
-    this.fileUpload.nativeElement.click();
-  }
-
-  uploadFileToServer(): void {
-    const file = this.fileUpload.nativeElement.files?.[0];
-    if (file) {
-      this.selectedFile = file;
-      this.fileSelected.emit(file);
-    }
-  }
-
-  clearFile(): void {
-    this.selectedFile = null;
-    this.fileUpload.nativeElement.value = '';
-    this.fileSelected.emit(null);
-  }
-}

package/src/lib/components/shared-list/shared-list.component.html

@@ -1,17 +0,0 @@
-<ng-container *ngIf="readyToLoad">
-  @if (editableTable) {
-    <app-editable-base-table [filterRequest]="filterRequest" [pageInfo]="pageInfo"
-                    [fields]="fields"
-                    [isPending]="isPending"
-    ></app-editable-base-table>
-
-  } @else {
-
-    <app-base-table [filters]="filters" [pageInfo]="pageInfo"
-                    [columns]="columnsDefinition"
-                    [listAction]="listAction"
-                    [isPending]="isPending"
-    ></app-base-table>
-
-  }
-</ng-container>

package/src/lib/components/shared-list/shared-list.component.spec.ts

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

package/src/lib/components/shared-list/shared-list.component.ts

@@ -1,53 +0,0 @@
-import {Component, OnInit} from '@angular/core';
-import {ActivatedRoute} from "@angular/router";
-import {NgIf} from "@angular/common";
-import {BaseTableComponent} from "../base-table/base-table.component";
-import {ButtonActionSettings, EMPTY_PAGE_INFO, FieldInfo, FilterRequest, PageInfo, TableColumn} from "../../base-model";
-import {Filter} from "../../base-model";
-import {EditableBaseTableComponent} from "../editable-base-table/editable-base-table.component";
-
-@Component({
-  selector: 'app-shared-list',
-  standalone: true,
-  imports: [
-    BaseTableComponent,
-    NgIf,
-    EditableBaseTableComponent
-  ],
-  templateUrl: './shared-list.component.html',
-  styleUrls:[ './shared-list.component.css']
-})
-export class SharedListComponent implements OnInit {
-  pageInfo: PageInfo = EMPTY_PAGE_INFO;
-  columnsDefinition: TableColumn<any>[] = [];
-  fields: FieldInfo[] = [];
-  filters: Filter[] = [];
-  readyToLoad: boolean = false;
-  isPending: boolean = false;
-  listAction: ButtonActionSettings[] = [];
-  editableTable : boolean = false;
-  filterRequest: FilterRequest = new FilterRequest();
-  constructor(private activatedRoute: ActivatedRoute) { }
-
-  ngOnInit(): void {
-    this.activatedRoute.data.subscribe(data => {
-      this.pageInfo = data['pageInfo'];
-      this.columnsDefinition = data["columnsDefinition"];
-      this.filters = data["filters"] || [];
-
-      this.isPending = 'pending' === data["mode"];
-      this.listAction = data['actions'];
-      this.editableTable = data['editableTable'] || false;
-      this.fields = data['fields'];
-
-      this.filterRequest = new FilterRequest();
-      this.filterRequest.columns = this.fields?.filter(c => c.type !== 'button').map(c => c.property) || [];
-      this.filterRequest.filters = this.filters;
-
-      this.readyToLoad = true;
-
-    });
-  }
-
-
-}

package/src/lib/components/title-bar/title-bar.component.css.map

@@ -1 +0,0 @@
-{"version":3,"sourceRoot":"","sources":[],"names":[],"mappings":"","file":"title-bar.component.css"}

package/src/lib/components/title-bar/title-bar.component.html

@@ -1,31 +0,0 @@
-<div [fxLayout]="!hideBackButton ? 'row' : 'column'" fxLayout.lt-md="column" fxLayoutGap="20px" fxLayoutGap.xs="1px" fxLayoutAlign="start center" fxLayoutAlign.lt-lg="start end" class="mainTitleBar">
-  <div fxLayout="column" fxFlex="auto" class="textTitle">
-    <h2><span class="textTitle__titleMode">{{titleMode | translate}}</span>
-      {{listTitle | translate}} <span *ngIf="titleCorporateAdmin&&isRoot">({{titleCorporateAdmin}})</span> {{extraData}}</h2>
-  </div>
-  <div fxLayout="column" fxFlex="auto"  style="place-items: end">
-    <button mat-flat-button color="primary" style="width: 100px" *ngIf="!hideBackButton" (click)="goBack()">
-      <mat-icon color="second">{{ backIcon }}</mat-icon>
-      <span style="font-weight: bold">{{ 'back' | translate }}</span>
-    </button>
-  </div>
-</div>
-<div fxLayout="row" fxLayout.lt-md="column" fxLayoutGap="20px" fxLayoutGap.xs="1px" fxLayoutAlign="start center" class="mainTitleBar" style="width: 100% !important;">
-  <button mat-raised-button class="btn-none-background-primary" (click)="publishEvent()" color="primary"
-          *ngIf="newAction">
-    {{ 'add_new' | translate }}
-  </button>
-
-  <button [disabled]="totalElements == 0" mat-stroked-button [matMenuTriggerFor]="appMenu" *ngIf="showExtractButton">
-    {{ 'extract' | translate }}
-    <mat-icon class="expand_more actionButton__expand">expand_more</mat-icon>
-  </button>
-
-
-</div>
-<mat-menu #appMenu="matMenu">
-    <button mat-menu-item (click)="doExtractReport('pdf')">PDF</button>
-    <button mat-menu-item (click)="doExtractReport('xlsx')">Excel</button>
-    <button mat-menu-item (click)="doExtractReport('csv')">CSV</button>
-    <button mat-menu-item *ngFor="let detail of  showDetails" (click)="doExtractReport(detail.type)">{{detail.title}}</button>
-</mat-menu>

package/src/lib/components/title-bar/title-bar.component.scss

@@ -1,23 +0,0 @@
-.mainTitleBar {
-  width: 100%;
-padding: 0 20px;
-  .textTitle {
-    width: 100%;
-    &__titleMode {
-      font-style: italic;
-      font-weight: 200;
-      color: grey;
-    }
-  }
-
-  .actionButton {
-    width: 100%;
-
-    &__expand {
-      font-size: 20px !important;
-      color: var(--accent-color);
-      margin-top: 5px
-    }
-  }
-
-}

package/src/lib/components/title-bar/title-bar.component.spec.ts

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

package/src/lib/components/title-bar/title-bar.component.ts

@@ -1,119 +0,0 @@
-import {Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges} from '@angular/core';
-import {Location, NgForOf, NgIf} from "@angular/common";
-import {MatIconModule} from "@angular/material/icon";
-import {MatButton} from "@angular/material/button";
-import {MatMenu, MatMenuItem, MatMenuTrigger} from "@angular/material/menu";
-import {FlexLayoutModule} from "@angular/flex-layout";
-import {TranslateModule} from "@ngx-translate/core";
-import {Directionality} from "@angular/cdk/bidi";
-
-@Component({
-  selector: 'app-title-bar',
-  standalone: true,
-  imports: [
-    NgIf,
-    MatIconModule,
-    MatButton,
-    MatMenuItem,
-    MatMenu,
-    NgForOf,
-    MatMenuTrigger,
-    FlexLayoutModule,
-    TranslateModule,
-
-  ],
-  templateUrl: './title-bar.component.html',
-  styleUrls: ['./title-bar.component.css', 'title-bar.component.scss']
-})
-export class TitleBarComponent implements OnInit, OnChanges {
-  @Input()
-  pageTitle: string = "";
-
-  @Input()
-  showExtractButton: boolean = false;
-
-  @Input()
-  totalElements?: number;
-
-  @Input()
-  titleMode: string = '';
-
-  @Input()
-  statusDesc?: string;
-
-  @Input()
-  newAction: boolean = false;
-
-
-  @Input() // @ts-ignore
-  extraButton: string;
-
-
-  @Input()
-  showDetails: any = [];
-
-  @Input()
-  showImport = false;
-
-  @Input()
-  showButton = false;
-
-  @Output()
-  newActionClicked = new EventEmitter();
-
-  @Output()
-  extraButtonClicked = new EventEmitter();
-
-
-  @Output()
-  extractReport = new EventEmitter();
-
-  @Input()
-  extraData = '';
-
-  listTitle = '';
-  newButton = '';
-
-  @Input()
-  titleCorporateAdmin: string = '';
-
-  isRoot: boolean = false;
-  @Input()
-  hideBackButton: boolean = true;
-
-  constructor(private location:Location,
-              private dir: Directionality) {
-  }
-
-  ngOnInit(): void {
-    this.listTitle = this.pageTitle;
-    this.newButton = this.extraButton;
-    // this.isRoot = this.authService.isRootOrg();
-    this.isRoot = false;
-  }
-  get backIcon(): string {
-    return this.dir.value === 'rtl' ? 'arrow_back' : 'arrow_forward';
-  }
-
-  publishEvent() {
-    this.newActionClicked.emit(true);
-  }
-
-
-  doExtractReport(value: any) {
-    this.extractReport.emit(value);
-  }
-  publishExtraButtonEvent() {
-    this.extraButtonClicked.emit(true);
-  }
-
-  ngOnChanges(changes: SimpleChanges): void {
-    if (changes["pageTitle"] && !changes["pageTitle"].isFirstChange() ) {
-      this.listTitle = this.pageTitle;
-    }
-  }
-
-  goBack() {
-    this.location.back()
-  }
-}