@unifylib/ui-lib 1.0.3

package/src/lib/services/backend-service.ts

@@ -0,0 +1,286 @@
+import {Inject, Injectable} from "@angular/core";
+import {HttpClient, HttpErrorResponse, HttpHeaders, HttpParams} from "@angular/common/http";
+import {Observable, of, Subject} from "rxjs";
+import {catchError, distinctUntilChanged} from "rxjs/operators";
+import {SnackMessage} from "../base-model/snack-message.model";
+import {PageInfo} from "../base-model/page-info";
+import {TranslateService} from "@ngx-translate/core";
+import {ColumnDef} from "../base-model/column-def.model";
+import {TableColumn} from "../base-model/table-column.interface";
+import {GetItemsList} from "../base-model/get-items-list";
+import {FieldAction} from "../base-model/field-action";
+import {Workflow} from "../base-model/workflow/workflow.model";
+import {ReportRequest} from "../base-model/report-request.model";
+import {FilterRequest} from "../base-model/filter-request";
+import {ResponseEnvelop} from "../base-model/response-envelop.model";
+import {FormGroup} from "@angular/forms";
+import { ActivatedRoute } from "@angular/router";
+import {TopPanel} from "./top-panel";
+import {DoActionRequest} from "../base-model/do-action-request";
+import {MatDialog} from "@angular/material/dialog";
+import {ActionConfirmationComponent} from "../components/action-confirmation/action-confirmation.component";
+
+const WORKFLOW_STATES_MAP: Record<number, string> = {
+    1: 'New',
+    2: 'Pending',
+    3: 'Terminated',
+    4: 'Completed',
+    5: 'Updated',
+    6: 'Default'
+};
+
+const EXCLUDED_REPORT_COLUMNS = ['listAction','button', 'checkbox'];
+@Injectable({
+    providedIn: 'root'
+})
+export class BackendService {
+    public topPanelMessage$ = new Subject<SnackMessage>();
+    // @ts-ignore
+    public parentForm: FormGroup;
+    public fieldAction$ = new Subject<FieldAction>();
+    public isEmptyItems: boolean = true;
+
+    constructor(private http: HttpClient,
+                private topPanel: TopPanel,
+                private translateService: TranslateService,
+                private route: ActivatedRoute,
+                private dialog: MatDialog,
+                @Inject('config') private config: any,
+                @Inject('secretsManager') private secretsManager: any) {
+
+        this.topPanelMessage$.subscribe(msg => {
+            this.topPanel.topPanelMessage$.next(msg);
+        })
+    }
+
+    set defaults(value: any | undefined) {
+    }
+
+    get defaults(): any | undefined {
+        return {};
+    }
+
+    getStatusDescription(element: any, workflow: Workflow) {
+        if (element?.stepId) {
+
+            let index = workflow?.workflowSteps?.findIndex(s => s.stepId === element.stepId);
+            if (index > -1) {
+                return this.translateService.getDefaultLang() === 'ar' ?
+                    workflow?.workflowSteps[index].stepNameAr || workflow?.workflowSteps[index].stepName:
+                    workflow?.workflowSteps[index].stepName;
+                // return this.translateService.instant(workflow?.workflowSteps[index].stepName);
+            } else {
+                return this.translateService.instant('INVENTORY.inprocessStatus');
+            }
+        } else {
+            if (element.statusId === 4 && element.statusDescription) {
+                return element.statusDescription;
+            } else if (element.statusId) {
+                return this.translateService.instant(WORKFLOW_STATES_MAP[element.statusId]);
+            } else {
+                return "unknown";
+            }
+        }
+    }
+//sss
+    getItemsByFilter(reportRequest: any, apiUrl: string): Observable<any> {
+        const url = `${this.getApiBasePath()}/api/v1${apiUrl}/list`;
+        return this.http.post(url, reportRequest, { headers: this.buildSecuredHeader()}).pipe(
+            distinctUntilChanged(),
+            catchError(err => of(err.message || err)));
+    }
+
+    getItemAuditLog(reportRequest: any, apiUrl: string): Observable<any> {
+        const url = `${this.getApiBasePath()}/api/v1${apiUrl}/audit-log`;
+        return this.http.post(url, reportRequest, { headers: this.buildSecuredHeader()}).pipe(
+            distinctUntilChanged(),
+            catchError(err => of(err.message || err)));
+    }
+
+
+    private buildSecuredHeader() {
+        const headers = new HttpHeaders({
+            'Content-Type': 'application/json',
+            Authorization: this.config.getAuthToken()
+        });
+        return headers;
+    }
+
+  public buildFormSecuredHeader() {
+    const headers = new HttpHeaders({
+      Authorization: this.config.getAuthToken()
+    });
+    return headers;
+  }
+
+  labelKey(column: any, pageInfo: PageInfo) {
+    const configuredKey = column.label ? column.label : column.property;
+
+    if (configuredKey && configuredKey.trim() !== '' && configuredKey.startsWith(pageInfo.labelsSection)) {
+      return configuredKey;
+    }
+
+    return `${pageInfo.labelsSection}.${configuredKey}`;
+  }
+
+
+    private buildReportColumn(columns: TableColumn<any>[], pageInfo: PageInfo): ColumnDef[] {
+        let columnDef: ColumnDef[] = [];
+
+          columns.filter(x => !EXCLUDED_REPORT_COLUMNS.includes(x.type)).forEach((c, index) => {
+            let transLabel = this.translateService.instant(this.labelKey(c,pageInfo));
+            let transGroup = pageInfo.supportGroupingInExport ?
+              c.group.trim() ? this.translateService.instant(c.group) : ' ' : null;
+            if (c.type === 'workflowStatus') {
+              transLabel = this.translateService.instant('workflowStatus');
+            }
+            if ((c.reportVisible === true) || (c.visible === true && c.reportVisible !== false)) {
+              columnDef.push(new ColumnDef(c, index, transLabel, this.translateService.getDefaultLang(),transGroup));
+            }
+        });
+        return columnDef;
+    }
+
+    private base64ToArrayBuffer(base64: string) {
+        const binaryString = window.atob(base64); // Comment this if not using base64
+        const bytes = new Uint8Array(binaryString.length);
+        return bytes.map((byte, i) => binaryString.charCodeAt(i));
+    }
+
+    buildReportRequest(columns: TableColumn<any>[], title: string | string[], filterRequest: FilterRequest, reportType: any, pageInfo: PageInfo, searchStr: string ,orientation='PORTRAIT'): ReportRequest {
+        const columnDef = this.buildReportColumn(columns, pageInfo);
+        const reportRequest = new ReportRequest({
+            dataset: [], filter: "",
+            columns: columnDef,
+            // sessionId: this.topPanel.userSession().sessionId,
+            sessionId: this.config.getAuthToken(),
+            title: this.translateService.instant(title),
+            prefLang: this.translateService.getDefaultLang(),
+            reportType: reportType,
+            searchStr: searchStr,
+            filterRequest: filterRequest,
+            orientation: orientation});
+        return reportRequest;
+    }
+
+    getLookupItemsByMultiFilter(listItems: GetItemsList, filterRequest?: FilterRequest): Observable<any> {
+      listItems.pageSize = 100;
+      filterRequest.pageSize = 100;
+        const params = new HttpParams().set('searchStr', listItems.searchStr);
+        let url = `${this.getApiBasePath()}/api/v1/${listItems.apiUri}`;
+        return this.http.post(url, filterRequest, { headers: this.buildSecuredHeader(), params: params}).pipe(
+            distinctUntilChanged(),
+            catchError(err => of(err.message || err)));
+    }
+    getLookupItemsByFilter(listItems: GetItemsList, cascadedId?: any): Observable<any> {
+        listItems.pageSize = 500;
+        const params = new HttpParams().set('searchStr', listItems.searchStr);
+        let url = `${this.getApiBasePath()}/api/v1/${listItems.apiUri}`;
+        if (cascadedId) {
+            url = url + `/${cascadedId}`
+        }
+
+        return this.http.post(url, listItems,{ headers: this.buildSecuredHeader()}).pipe(
+            distinctUntilChanged(),
+            catchError(err => of(err.message || err)));
+    }
+
+
+
+    downloadReport(reportRequest: ReportRequest, pageApiPath : string, readyPath? : boolean ) {
+      const s = readyPath === true ? `/api/v1${pageApiPath}` : `/api/v1${pageApiPath}/extractAndDownloadListReport`;
+      return this.http.post<ResponseEnvelop>(this.getApiBasePath() + s, reportRequest, {headers: this.buildSecuredHeader()}).subscribe(
+            (resp:ResponseEnvelop) => {
+                if (resp.valid) {
+                    if (resp.body) {
+                        const filename = reportRequest.title + "." + reportRequest.reportType;
+                        const blob = new Blob([this.base64ToArrayBuffer(resp.body)]);
+                        if (navigator.msSaveBlob) {
+                            navigator.msSaveBlob(blob, filename);
+                        } else {
+                            const link = document.createElement('a');
+                            // Browsers that support HTML5 download attribute
+                            if (link.download !== undefined) {
+                                const url = URL.createObjectURL(blob);
+                                link.setAttribute('href', url);
+                                link.setAttribute('download', filename);
+                                link.style.visibility = 'hidden';
+                                document.body.appendChild(link);
+                                link.click();
+                                document.body.removeChild(link);
+                            }
+                        }
+                    } else {
+                        this.topPanel.topPanelMessage$.next(new SnackMessage(resp.message.toString(), true, 'info'));
+                    }
+                } else {
+                    this.topPanel.topPanelMessage$.next(new SnackMessage(resp.message.toString(), false, 'error'));
+                }
+            }
+        );
+
+    }
+
+    private getApiBasePath(){
+      return this.config.getBaseApi();
+    }
+
+  doActionWithAttachments(request: DoActionRequest, param2: any[], pageInfo: PageInfo) {
+    const url = `${this.getApiBasePath()}/api/v1${pageInfo.apiUri}/doActionWithAttachments`;
+    const formData: FormData = new FormData();
+    formData.set('doActionRequest', new Blob([JSON.stringify(request)], {
+      type: "application/json"
+    }));
+
+    return this.http.post(url, formData, { headers: this.buildFormSecuredHeader() }).pipe(
+      distinctUntilChanged(),
+      catchError((error: HttpErrorResponse) => {
+        return of(error.error);
+      })
+    );
+
+  }
+  doActionWithAttachment(request: DoActionRequest, file: File, pageInfo: PageInfo) {
+    const url = `${this.getApiBasePath()}/api/v1${pageInfo.apiUri}/doActionWithAttachments`;
+    const formData: FormData = new FormData();
+
+    formData.append('files', file);
+    formData.set('doActionRequest', new Blob([JSON.stringify(request)], {
+      type: "application/json"
+    }));
+
+    return this.http.post<any>(url, formData, {
+      headers: this.buildFormSecuredHeader()
+    }).pipe(
+      distinctUntilChanged(),
+      catchError((error: HttpErrorResponse) => {
+        // Transform the error into a fake success-like response
+        return of(error.error); // This will now be passed to `next` in subscribe()
+      })
+    );
+  }
+
+  encrypt(message: any) {
+    return this.secretsManager.encryptSecret(message);
+  }
+
+  decrypt(secret: any) {
+    return this.secretsManager.decryptSecret(secret);
+  }
+
+  public getConfirmation(): Observable<any> {
+    const dialogRef = this.dialog.open(ActionConfirmationComponent, {
+      data: {acceptActionLabel: 'accept',rejectActionLabel:'return', warningMsg: 'confirmation_message'},
+      width: '600px',
+      height: 'auto'
+    });
+    return dialogRef.afterClosed();
+  }
+
+}
+
+declare global {
+    interface Navigator {
+        msSaveBlob: (blobOrBase64: Blob | string, filename: string) => void
+    }
+}

package/src/lib/services/index.ts

@@ -0,0 +1,3 @@
+export * from './backend-service';
+export * from './top-panel';
+export * from './trigger-form.service'

package/src/lib/services/top-panel.ts

@@ -0,0 +1,17 @@
+import {Injectable} from "@angular/core";
+import {BehaviorSubject} from "rxjs";
+import {SnackMessage} from "../base-model/snack-message.model";
+
+@Injectable({
+  providedIn: 'root'
+})
+export class TopPanel {
+
+  public topPanelMessage$ = new BehaviorSubject<SnackMessage>({
+    message: '',
+    translate: false,
+    type: 'info',
+    translateParams: {}
+  });
+
+}

package/src/lib/services/trigger-form.service.ts

@@ -0,0 +1,11 @@
+import {Injectable, signal} from '@angular/core';
+
+@Injectable({
+  providedIn: 'root'
+})
+
+
+export class ShareDataService {
+  trigger = signal<boolean>(true);
+  enableTrigger = (() => (() => this.trigger.update((val) => val = !val)))
+}

package/src/lib/share-module/shared-module.ts

@@ -0,0 +1,10 @@
+// projects/your-lib/src/lib/shared/shared.module.ts
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+// Import other shared modules (e.g., Angular Material modules)
+
+@NgModule({
+  imports: [CommonModule],
+  exports: [CommonModule]
+})
+export class SharedModule { }

package/src/lib/styles/invoiceq-theme.scss

@@ -0,0 +1,252 @@
+@use '@angular/material' as mat;
+
+@include mat.core();
+
+//@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@200..1000&display=swap');
+
+// Define a custom typography config that overrides the font-family as well as the
+// `headlines` and `body-1` levels.
+
+$custom-typography: mat.define-typography-config(
+        $font-family: 'Cairo',
+        $headline-1: mat.define-typography-level(112px, 112px, 300),
+        $headline-2: mat.define-typography-level(56px, 56px, 400),
+        $headline-3: mat.define-typography-level(45px, 48px, 400),
+        $headline-4: mat.define-typography-level(34px, 40px, 400),
+        $headline-5: mat.define-typography-level(24px, 32px, 400),
+        $headline-6: mat.define-typography-level(20px, 32px, 500),
+        $subtitle-2: mat.define-typography-level(16px, 28px, 400),
+        $subtitle-1: mat.define-typography-level(15px, 24px, 400),
+        $body-2: mat.define-typography-level(14px, 24px, 500),
+        $body-1: mat.define-typography-level(14px, 20px, 400),
+        $caption: mat.define-typography-level(12px, 20px, 400),
+        $button: mat.define-typography-level(14px, 14px, 500),
+        $overline: mat.define-typography-level(inherit, 1.125, 400)
+);
+
+@include mat.all-component-themes($custom-typography);
+// Override typography for all Angular Material, including mat-base-typography and all components.
+@include mat.all-component-typographies($custom-typography);
+
+@include mat.core-theme($custom-typography);
+
+/* For use in src/lib/core/theming/_palette.scss */
+$md-primary: (
+        50 : #e3f4f5,
+        100 : #b8e4e6,
+        200 : #89d2d5,
+        300 : #59bfc4,
+        400 : #36b2b8,
+        500 : var(--primary-color),
+        600 : #109ca4,
+        700 : #0d929a,
+        800 : #0a8991,
+        900 : #057880,
+        A100 : #aef9ff,
+        A200 : #7bf4ff,
+        A400 : #48f0ff,
+        A700 : #2feeff,
+        contrast: (
+                50 : #000000,
+                100 : #000000,
+                200 : #000000,
+                300 : #000000,
+                400 : #000000,
+                500 : #ffffff,
+                600 : #ffffff,
+                700 : #ffffff,
+                800 : #ffffff,
+                900 : #ffffff,
+                A100 : #000000,
+                A200 : #000000,
+                A400 : #000000,
+                A700 : #000000,
+        )
+);
+
+$md-accent: (
+        50 : #e0e0e0,
+        100 : #b3b3b3,
+        200 : #808080,
+        300 : #4d4d4d,
+        400 : #262626,
+        500 : var(--accent-color),
+        600 : #000000,
+        700 : #000000,
+        800 : #000000,
+        900 : #000000,
+        A100 : #a6a6a6,
+        A200 : #8c8c8c,
+        A400 : #737373,
+        A700 : #666666,
+        contrast: (
+                50 : #000000,
+                100 : #000000,
+                200 : #000000,
+                300 : #ffffff,
+                400 : #ffffff,
+                500 : #ffffff,
+                600 : #ffffff,
+                700 : #ffffff,
+                800 : #ffffff,
+                900 : #ffffff,
+                A100 : #000000,
+                A200 : #000000,
+                A400 : #ffffff,
+                A700 : #ffffff,
+        )
+);
+
+$md-warn: (
+        50 : #f9e0e0,
+        100 : #f0b3b3,
+        200 : #e68080,
+        300 : #db4d4d,
+        400 : #d42626,
+        500 : #cc0000,
+        600 : #c70000,
+        700 : #c00000,
+        800 : #b90000,
+        900 : #ad0000,
+        A100 : #ffd7d7,
+        A200 : #ffa4a4,
+        A400 : #ff7171,
+        A700 : #ff5858,
+        contrast: (
+                50 : #000000,
+                100 : #000000,
+                200 : #000000,
+                300 : #ffffff,
+                400 : #ffffff,
+                500 : #ffffff,
+                600 : #ffffff,
+                700 : #ffffff,
+                800 : #ffffff,
+                900 : #ffffff,
+                A100 : #000000,
+                A200 : #000000,
+                A400 : #000000,
+                A700 : #000000,
+        )
+);
+
+
+$my-theme-primary: mat.define-palette($md-primary);
+$my-theme-accent: mat.define-palette($md-accent);
+//the third, for the warn color, is the predefined material red palette
+$my-theme-warn: mat.define-palette(mat.$red-palette);
+
+$invoiceq-theme: mat.define-light-theme($my-theme-primary, $my-theme-accent, $my-theme-warn);
+
+@include mat.all-component-themes($invoiceq-theme);
+
+:root {
+  --primary-color: #00A8C4;
+  --background-color: white;
+  --accent-color: #222222;
+  --primary-color-2nd: #1C355E;
+}
+
+.primpary-color-a40 {
+  background-color: rgba(var(--primary-color), 0.4);
+}
+
+.mat-button-toggle {
+  background-color: mat.get-color-from-palette($md-primary);
+  color: mat.get-color-from-palette($md-primary, default-contrast);
+}
+
+.mat-sort-header-arrow {
+  color: white !important;
+}
+.mat-button-toggle-checked {
+  background-color: mat.get-color-from-palette($md-accent);
+  color: mat.get-color-from-palette($md-accent, default-contrast);
+}
+
+.mat-checkbox-layout { white-space: normal !important; }
+.mat-form-field-wrapper {
+  padding-bottom: 0.25em;
+}
+
+.mat-form-field-prefix {
+  align-self: center;
+  margin-top: -2px;
+  font-weight: bold;
+}
+
+.mat-form-field {
+  font-size: 14px;
+  //font-weight: bold;
+  //border-radius: 12px !important;
+}
+
+.mat-form-field-appearance-outline .mat-form-field-outline {
+  background-color: white;
+  border-radius: 5px;
+}
+
+.mat-list-option[aria-selected="true"] {
+  background: transparent !important;
+  color: var(--primary-color);
+}
+.mat-list-option {
+  background: transparent !important;
+  margin-top: 1px;
+}
+.mat-select-panel {
+  font-size: 18px;
+  width: 50%;
+}
+.mat-list-option:hover {
+  font-weight: bold;
+  background-color: transparent !important;
+}
+
+.mat-drawer-container {
+  background-color: transparent !important;
+}
+
+tr.mat-row:hover {
+  font-weight: bold;
+  box-shadow: 1px 3px 3px rgba(0,0,0,0.25);
+
+  transform: scale(1);
+}
+.mat-flat-button.mat-accent, .mat-raised-button.mat-accent, .mat-fab.mat-accent, .mat-mini-fab.mat-accent {
+  background-color: var(--accent-color);
+}
+
+.no-data {
+  pointer-events: none;
+}
+.allow-no-data {
+  color: red;
+}
+
+
+.iq_loading {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  background: rgba(0, 0, 0, 0.15);
+  z-index: 1000;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  height: 100%;
+}
+
+.primary-chip {
+  background-color: var(--primary-color);
+}
+
+.accent-chip {
+  background-color: var(--accent-color);
+}
+
+
+
+//.mat-sidenav-container { background-color: transparent!important; }